brandon's blog

For security reasons, Facebook adviced that all apps and sites must migrate to the OAuth 2.0 authentication mechanism by September 1, 2011 from the legacy Connect authentication flow.

Update: Using latest OAuth 2.0 protocol for authentication

   window.fbAsyncInit = function () {
        FB.init({
            appId: '@facebookAppId', // App ID
            status: true, // check login status
            cookie: true, // enable cookies to allow the server to access the session
            xfbml: true,  // parse XFBML
            oauth: true
        });
        runFbInitCriticalCode();
    }; 

    function runFbInitCriticalCode() {
        // Additional initialization code here
        FB.Event.subscribe('auth.login', function () {
            window.location = "/AuthenticateFacebookPage";
        }); 

        FB.Event.subscribe('auth.logout', function (response) { 

        });
    };  

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

After login, check the FB object returned using console.

FB will contain the Login(connect) status, AccessToken and UserId, which can be used to retrieve other information using the Graph API. FB also contains the method FB.logout().

The APP ID (not Facebook API key) is needed in both instances, when initialising FB and also when retrieving information from Graph.

If the APP ID is wrong, the login dialogue (popup) may auto-close upon a login attempt. If the APP ID is right and the login dialogue auto-closes, it may be because you are already detected logged in. If the login dialogue displays error, log into your Facebook account as application administrator and make sure OAuth2.0 is enabled for that application. Lastly, ensure the domain name root is the same as the one saved for the application.

UPDATE:

For custom designed Facebook login buttons, we can call the login function explicitly by:

http://developers.facebook.com/docs/reference/javascript/FB.login/

FB.login(function(response) {
   if (response.authResponse) {
     //Token, Login Status can be grabbed from response.authResponse
   } else {
     console.log('User cancelled login or did not fully authorize.');
   }
 }, {scope: 'email'});

Using the above, we can remove the subscribe to login event and call the login function by a button’s click event instead:

$('#buttonID').on('click', function(e) {
    e.preventDefault();
    // FB.Login Code here
});