如何在页面加载时触发FB.login()?

时间:2013-11-29 16:56:36

标签: jquery facebook-javascript-sdk facebook-login

FB.login()似乎只有在点击事件触发时才有效。我希望它在页面加载时触发。我已尝试使用trigger()方法,但这不起作用。我也尝试使用jQuery('#button').click()触发它。

$(function(){
    //this is logging so I know the js is loading properly

    console.log("script loaded");

    $('button').button();

    $('#button').click(function(){   
        FB.login(function(response) {
            console.log('FBLOGIN firing');
            if(response.status === "connected"){
                var uID = response.authResponse.userID;
                FB.api('/me', function(response) {
                    var name = response.name;             
                    if(response.location){
                        var response = response.location.name;
                    }else{
                        alert("The Bringer Network needs your current city to be set in your Facebook 'about' section. Please make it public for our use");
                    } 
                });//closes fb.api
            }else if(response.status === "not_authorized"){
                //authCancelled. redirect
            }
        },{scope: 'user_location,user_likes'});
    });//closes click
    jQuery('#button').click();
});

2 个答案:

答案 0 :(得分:7)

所以我放弃了将登录代码放在单独的.js文件中的想法。我只是将FB.login方法放在window.fbAsyncInit块内的html中,以及FB.init代码中。它完美地运作。

   <body>
        <div id="fb-root"></div>
    <script>

  window.fbAsyncInit = function() {

      FB.init({
        appId      : '140*****07', // App ID
        channelUrl : '//http://s******.com/channel.html', // Channel File
        status     : true, // check login status
        cookie     : true, // enable cookies to allow the server to access the session
        oauth      : true,
        xfbml      : true  // parse XFBML
      });

    FB.login(function (response) {

            if (response.status === "connected") {

                        var uID = response.authResponse.userID;

                        console.log(uID);

                      FB.api('/me', function (response) {

                             var name = response.name;
                             var locationName = ' ';

                             if (response.location) {

                                locationName = response.location.name;
                                console.log(locationName);

                            } else {

                                alert("your current city needs to be set in your Facebook 'about' section. Please make it public for our use");

                            }
                       });//closes fb.api

                    } else if (response.status === "not_authorized") {

                        //authCancelled. redirect
                    }
                },
                {
                    scope: 'user_location,user_likes'
                }
            );


      };//closes window.fbAsynInit

    // Load the SDK asynchronously

      (function(d){
       var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];
       if (d.getElementById(id)) {return;}
       js = d.createElement('script'); js.id = id; js.async = true;
       js.src = "//connect.facebook.net/en_US/all.js";
       ref.parentNode.insertBefore(js, ref);
      }(document));

     </script> 

       <h1 id="redirecting">Redirecting</h1>
       <button id="button">click</button>

       <img id='backgroundImg' src="https://sa*****.com/template.jpg"/>

   </body>
</html>

答案 1 :(得分:3)

将按钮单击处理函数移出到变量:

var fbLogin = function () {
    // FB.login() ...
}

它作为点击监听器:$('#button').click(fbLogin)并在页面加载时调用它。

完整的代码应该是这样的:

var fbLogin = function () {
        FB.login(
            function (response) {
                if (response.status === "connected") {
                    var uID = response.authResponse.userID;

                    FB.api('/me', function (response) {
                        var name = response.name,
                            locationName;

                        if (response.location) {
                            locationName = response.location.name;
                        } else {
                            alert("The Bringer Network needs your current city to be set in your Facebook 'about' section. Please make it public for our use");
                        }
                    });//closes fb.api
                } else if (response.status === "not_authorized") {
                    //authCancelled. redirect
                }
            },
            {
                scope: 'user_location,user_likes'
            }
        );
    };

$(function () {
    $('#button')
        .button()
        .click(fbLogin);
});

window.fbAsyncInit = function () {
    // init the FB JS SDK
    FB.init({
        appId: 'YOUR_APP_ID', // App ID from the app dashboard
        status: true, // Check Facebook Login status
        xfbml: true // Look for social plugins on the page
    });

    // Call fbLogin
    fbLogin();
};