Rohit Agrawal Rohit Agrawal - 5 months ago 81
Javascript Question

fb login popup block

I am making using fb login feature but problem comming to me is that whenever I click on the fb login button before page media loading is completed, it blocks the popup for fb login but if I click on fblogin after a second passed to loading event it works

Here is the function I am using:

function fb_login() {
var email='';
console.log(loginClassbackQueue);
// console.log('user wants to login with fb');
FB.getLoginStatus(function(response) {
if(response.status!='connected'){
FB.login(function(response) {
// console.log(response);
if (response.authResponse) {
// console.log('user logged in successfully');
// console.log(response);
email = update_f_data_login(response);
$('#fb_login_popup, #popup_overlay').hide();
// loginme(email);
}
else {
loginClassbackQueue = [];
// console.log('user failed to login');
}
// console.log('fb login completed successfully');
}, {scope:"email,user_birthday,user_likes,user_location,friends_likes,publish_actions"}
);
}
else{
// console.log('logged in and connected');
email = update_f_data_login(response);
$('#fb_login_popup, #popup_overlay').hide();
}

});

}


The same action when I do on this site http://fab.com/ it open popups always never block a popup.

Answer

You cannot call FB.login from the callback of FB.getLoginStatus.

Browsers tend to block popup windows of the popup is not spawned as an immediate result of a user's click action.

Because FB.getLoginStatus does an ajax call and you call FB.login on it's response, the popup that would open as a result of this call is blocked.

A solution to your problem would be to call FB.getLoginStatus on page load and use the response inside your fb_login() method.