I have this button:

<img src="static/img/facebook_button.png" id="login-fb" onclick="login();" />

I also have this script:

window.fbAsyncInit = function(){
    FB.init({
        appId : 'MY_APP_ID',
        status : true,
        cookie : true,
        xfbml : false
    });
};

Finally, I have this function:

function login()
{
    facebookPerms = [
        'user_photos', 'email', 'offline_access', 'user_relationships', 'read_stream',
        'user_about_me', 'user_birthday', 'user_education_history', //'publish_stream',
        'user_hometown', 'user_interests', 'user_location', 'user_likes',
        'user_religion_politics', 'user_activities', 'user_work_history'
    ];
    //Get the facebook login status
    FB.getLoginStatus(function(response) {
        if (response.session) {
            // logged in and connected user, someone you know
            ajaxLogin();
        } else {
            //Display the facebook login dialog
            FB.login(function(response) {
                if (response.authResponse) {
                    // user is logged in and granted some permissions.
                    // perms is a ma separated list of granted permissions
                    ajaxLogin();
                } else {
                    // user is not logged in, display the error dialog box
                    errorNotLogged();
                }
            }, {
                //Ask for permissions of Facebook
                scope: facebookPerms.join(',')
            });
        }
    });
}

I am following this Facebook rule:

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.

And my website still gets its Facebook popup blocked in IE9. Any ideas how to solve this? Any ideas how other people do this without having their scripts being blocked?

I have this button:

<img src="static/img/facebook_button.png" id="login-fb" onclick="login();" />

I also have this script:

window.fbAsyncInit = function(){
    FB.init({
        appId : 'MY_APP_ID',
        status : true,
        cookie : true,
        xfbml : false
    });
};

Finally, I have this function:

function login()
{
    facebookPerms = [
        'user_photos', 'email', 'offline_access', 'user_relationships', 'read_stream',
        'user_about_me', 'user_birthday', 'user_education_history', //'publish_stream',
        'user_hometown', 'user_interests', 'user_location', 'user_likes',
        'user_religion_politics', 'user_activities', 'user_work_history'
    ];
    //Get the facebook login status
    FB.getLoginStatus(function(response) {
        if (response.session) {
            // logged in and connected user, someone you know
            ajaxLogin();
        } else {
            //Display the facebook login dialog
            FB.login(function(response) {
                if (response.authResponse) {
                    // user is logged in and granted some permissions.
                    // perms is a ma separated list of granted permissions
                    ajaxLogin();
                } else {
                    // user is not logged in, display the error dialog box
                    errorNotLogged();
                }
            }, {
                //Ask for permissions of Facebook
                scope: facebookPerms.join(',')
            });
        }
    });
}

I am following this Facebook rule:

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.

And my website still gets its Facebook popup blocked in IE9. Any ideas how to solve this? Any ideas how other people do this without having their scripts being blocked?

• javascript
• facebook
• internet-explorer
• authentication
• facebook-login

Share Improve this question Follow edited Jun 22, 2012 at 16:01 user2428118 8,12444 gold badges4646 silver badges7373 bronze badges asked Jun 22, 2012 at 12:34 Дамян СтанчевДамян Станчев 2,67455 gold badges3131 silver badges5353 bronze badges

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 6

Try the following:

• Fetch the user login status.
• If the user is not logged in, show a login button.
• On click call the FB.login function directly.

In your implementation FB.login is not called directly after a user interaction, but as a part of a callback function of FB.getLoginStatus. I guess this causes IE to block the popup.