Search code examples
facebookfacebook-javascript-sdkfacebook-appsfacebook-login

FB.Login dialog popup does not callback when closed


FB.Login Popup Dialog http://s17.postimg.org/47zhfnt0d/8_1_2014_6_33_34_PM.jpg

  • FB.Login has 3 clickable buttons:
    1. Cancel
    2. Okay
    3. "Close" button on top right(close popup window)

When user click both Cancel & Okay button, call back is triggered with authResponse which allows me to process whether the user authorize the app.

But if user click "Close" to close the popup, I receive authResponse only once. The second time user close FB.Login dialog pop up, callback function is not triggered.

Here's my code:

FB.login(facebook_login, { scope: 'email, publish_actions, user_birthday' });

function facebook_login(response) {
    console.log('facebook_login');    //update
    console.log(response);            //update
    if (response.status === 'connected') {
        console.log('connected');
    }
    else if (response.status === 'not_authorized') {
        FB.login(facebook_login, { scope: 'email, publish_actions, user_birthday' });
    }
    else {
        // the user isn't logged in to Facebook.
        FB.login(facebook_login, { scope: 'email, publish_actions, user_birthday' });
    }
}

I intend to prompt user 3 times to authorize the app.

### Update ###

I actually records every response my callback function received. See above update, but closing the dialog popup only return response once, with "status = not_authorized". Clicking Cancel will have the same status returned, but login popup will show again.

My Console Log:

Callback response log
(source: imghost.us)


Solution

  • Sorry to say it, but you shouldn't try to re do the auth if the user has cancelled - if you try to call FB.login again in the callback to FB.login then the user's pop up blocker will trigger and the dialog will fail. In Chrome, for example, they will see something like this:

    enter image description here

    Instead, you should display a message to the user telling them why they need to authenticate and with a button or link below for them to try again if they change their mind.

    If you are calling FB.login in the callback, this is an asynchronous event and most browsers prevent popups from appearing in this type of situation. From the Facebook FB.login docs:

    Calling FB.login results in the JS SDK attempting to open a popup window. As such, this method should only be called after a user click event, otherwise the popup window will be blocked by most browsers.