Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

FB redirect issue with white page in iOS chrome

When I press the login button I get the facebook page where I have to give permission to use my facebook account.

After I give permission, it redirects to https://www.facebook.com/dialog/permissions.request and a blank page is shown. On Android the "window.FB.login" callback is called (see code below) where I can get the info and redirect the user but on Windows Phone it only shows that blank page. When I go to my facebook page, my site is registered in the app list. So the registration did work correctly.

like image 892
ravivlb Avatar asked Jan 25 '13 09:01

ravivlb


1 Answers

This error has been caused due to unsafe loading of facebook js file.

For integrating Facebook app in your application you have to follow the steps instructed in Facebook app documentation.

    var fbApi = {
      init: function () {
      $.getScript(document.location.protocol + '//connect.facebook.net/en_US/all.js', function () {
        if (window.FB) {
            window.FB.init({
                appId: MY_APP_ID,
                status: true,
                cookie: true,
                xfbml: false,
                oauth: true,
                channelUrl: 'http://www.yourdomain.com/channel.html'
            });

        }
    });
    },
    login: function () {
    /// <summary>
    /// Login facebook button clicked
    /// </summary>
    log("login facebook button clicked");

    if (window.FB) {

        //Windows phone does not enter this method, Android and Iphone do
        window.FB.login(function (response) {

            if (response.status) {
                log('it means the user has allowed to communicate with facebook');

                fbAccessToken = response.authResponse.accessToken;
                window.FB.api('/me', function (response) {
                    //get information of the facebook user.
                    loginService.subscribeSocialUser(response.id, response.first_name, response.last_name, fbAccessToken, "", "FaceBook", fbSucces, fbFail);

                });
            } else {
                log('User cancelled login or did not fully authorize.');

            }
        },
        { scope: 'email'
        });
    }

}
};

channel URL is added so as to resolve any cross browser issues. It should point to an html file which refers to the js as follows:

<script src="//connect.facebook.net/en_US/all.js"></script>

If once an error has been hit while initializing Facebook.js, you will not be able to login successfully.

You can load java script either synchronously or asynchronously.

(function(d, debug){
     var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];
     if (d.getElementById(id)) {return;}
     js = d.createElement('script'); js.id = id; js.async = true;
     js.src = "//connect.facebook.net/en_US/all" + (debug ? "/debug" : "") + ".js";
     ref.parentNode.insertBefore(js, ref);
   }(document, /*debug*/ false));
like image 114
Hamid Narikkoden Avatar answered Nov 11 '22 16:11

Hamid Narikkoden