Facebook permissions window doesn't appear on tablets using JS SDK

Question

I'm using the login code from Facebooks documentation:

This works fine in desktop browsers but on tablets the whole site tries to redirect to an https://m.facebook.com... URL instead of showing the permissions pop up. The page it redirects to just displays Error. Can pop ups not work in Facebook Javascript SDK?

<div id="fb-root"></div>
<script type="text/javascript">

    var likesPage = false;
    var addisPageId = 'XXXXXX';


    window.fbAsyncInit = function () {
        // init the FB JS SDK
        FB.init({
            appId: 'XXXXXXX',                        // App ID from the app dashboard
            channelUrl: '/channel.html', // Channel file for x-domain comms
            status: true,                                 // Check Facebook Login status
            xfbml: true                                  // Look for social plugins on the page
        });

        // Additional initialization code such as adding Event Listeners goes here
    };

    // 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_gb/all.js";
        fjs.parentNode.insertBefore(js, fjs);
    } (document, 'script', 'facebook-jssdk'));
    function callLogin() {
        FB.login(function (response) {
            var access_token = FB.getAuthResponse()['accessToken'];
            $("#at").val(access_token);

            if (response.authResponse) {
                FB.api('/me/likes?fields=id', function (response) {

                    for (var i = 0; i < response.data.length; i++) {
                        if (response.data[i].id == addisPageId) {
                            likesPage = true;
                            break;
                        }
                    }
                    if (likesPage) {
                        FB.api('/me', function (userInfo) {
                            document.getElementById("email").value = userInfo.email;
                            document.getElementById("fbId").value = userInfo.id;
                            document.getElementById("fbform").submit();
                        });
                    } else {
                        document.getElementById("dontLikePage").style.display = "inline";
                    }
                });
            } else {
                window.parent.location = "https://www.facebook.com/XXXX";
            }
        }, { scope: 'user_likes,email,publish_stream' });

    }
</script>

score 0 · Answer 1 · answered Nov 08 '13 at 16:32

Had this issue a while a go. I got around it by using thee facebook login button https://developers.facebook.com/docs/reference/plugins/login/ this works fine on tablets but using the fb.login in javascript just errors because of the issue you described.

Facebook permissions window doesn't appear on tablets using JS SDK

1 Answers1