直到单击按钮，才能开始Facebook登录

Question

Right now my facebook login code automatically logs someone in when they visit the page. Which is not good.

How can I make it so it only logs them in if they click the on the login button? I tried a couple of things but they didn't seem to work

<script>
  // This is called with the results from from FB.getLoginStatus().
  function statusChangeCallback(response) {
    if (response.status === 'connected') {
      var accessToken = response.authResponse.accessToken;
      $.post("includes/login.php", {
            token: accessToken
        })
  .success(function() {
            location.reload();
        });
    }
  }
  function checkLoginState() {
    FB.getLoginStatus(function(response) {
      statusChangeCallback(response);
    });
  }

  window.fbAsyncInit = function() {
  FB.init({
    appId      : 'xxx',
    cookie     : true,  // enable cookies to allow the server to access 
                        // the session
    xfbml      : true,  // parse social plugins on this page
    version    : 'v2.5' // use version 2.2
  });

  FB.getLoginStatus(function(response) {
    statusChangeCallback(response);
  });

  };

  // Load the SDK asynchronously
  (function(d, s, id) {
    var js, fjs = d.getElementsByTagName(s)[0];
    if (d.getElementById(id)) return;
    js = d.createElement(s); js.id = id;
    js.src = "//connect.facebook.net/en_US/sdk.js";
    fjs.parentNode.insertBefore(js, fjs);
  }(document, 'script', 'facebook-jssdk'));

</script>

<fb:login-button scope="public_profile,email,user_friends,user_birthday,user_location" onlogin="checkLoginState();">
</fb:login-button>

Answer 1

I've found the solution:

Make sure you have status: true in your init otherwise it will be blocked as a popup. Hope fully this helps someone else.

<script>
  window.fbAsyncInit = function() {
  FB.init({
    appId      : 'xxx',
    cookie     : true,  // enable cookies to allow the server to access 
                        // the session
    xfbml      : true,  // parse social plugins on this page
    version    : 'v2.5', // use version 2.2
    status: true
  });

};

// Load the SDK asynchronously
  (function(d, s, id) {
    var js, fjs = d.getElementsByTagName(s)[0];
    if (d.getElementById(id)) return;
    js = d.createElement(s); js.id = id;
    js.src = "//connect.facebook.net/en_US/sdk.js";
    fjs.parentNode.insertBefore(js, fjs);
  }(document, 'script', 'facebook-jssdk'));

$('#facebook').on('click', function() {
 $("#facebook").html('Logging In...');
   FB.getLoginStatus(function(response) {
      if (response.status === 'connected') {
         var accessToken = response.authResponse.accessToken;
         $.post("includes/login.php", {
            token: accessToken
         })
         .success(function() {
            location.reload();
         });
      } else if (response.status === 'not_authorized') {
        login();
      } else {
        login();
      }
   });
});

function login()
{
    FB.login(function(response) {
       if (response.authResponse) {
        var accessToken = response.authResponse.accessToken;
         $.post("includes/login.php", {
            token: accessToken
         })
         .success(function() {
            location.reload();
         });
        } else {
          $("#facebook").html('Sign In With Facebook');
        }
    }, {scope: 'public_profile,email,user_friends,user_birthday,user_location'});
}
</script>

Answer 2

Try this :

<script>
      // This is called with the results from from FB.getLoginStatus().
      function statusChangeCallback(response) {
        if (response.status === 'connected') {
          var accessToken = response.authResponse.accessToken;
          $.post("includes/login.php", {
                token: accessToken
            })
      .success(function() {
                location.reload();
            });
        }
      }
      function checkLoginState() {
        FB.getLoginStatus(function(response) {
          statusChangeCallback(response);
        });
      }

      window.fbAsyncInit = function() {
      FB.init({
        appId      : 'xxx',
        cookie     : true,  // enable cookies to allow the server to access 
                            // the session
        xfbml      : true,  // parse social plugins on this page
        version    : 'v2.5' // use version 2.2
      });

      };

      // Load the SDK asynchronously
      (function(d, s, id) {
        var js, fjs = d.getElementsByTagName(s)[0];
        if (d.getElementById(id)) return;
        js = d.createElement(s); js.id = id;
        js.src = "//connect.facebook.net/en_US/sdk.js";
        fjs.parentNode.insertBefore(js, fjs);
      }(document, 'script', 'facebook-jssdk'));

    </script>

    <fb:login-button scope="public_profile,email,user_friends,user_birthday,user_location" onlogin="checkLoginState();">
    </fb:login-button>

     - List item