Warm tip: This article is reproduced from stackoverflow.com, please click
facebook facebook-graph-api facebook-javascript-sdk facebook-login

Facebook social login shows conflicting information AND javascript SDK is buggy?

发布于 2020-04-13 09:40:45

I am using code directly from facebook docs: https://developers.facebook.com/docs/javascript/quickstart/

<body>
    <script>
        //this gets called immediately after sdk.js loads 
        window.fbAsyncInit = function() {

            FB.init({
                appId            : '12345...MYIDHERE...6789',
                autoLogAppEvents : true,
                xfbml            : true,
                version          : 'v5.0'
            });

            //check if user is logged in...
            FB.getLoginStatus(function (response) {   
                    console.log('initial-check:', response);
            });
        };

        //check if user is logged in... - AFTER facebook Login Popup returns.
        function callback_afterLogin() {
            FB.getLoginStatus(function (response) {   
                console.log('callback_afterLogin:', response);
            });
        }
    </script>
    <script async defer src="https://connect.facebook.net/en_US/sdk.js"></script>

    <div class="fb-login-button" 
        data-size="large"
        data-button-type="login_with" 
        data-auto-logout-link="true"
        onlogin="callback_afterLogin"
        data-use-continue-as="false">
    </div>

</body>

The fb-login-button renders as 'Log Out', which indicates to me the button detects I am already logged into Facebook AND also into the App itself.

The problem is the FB.getLoginStatus() response.status === 'unknown' ! Why ? I would have expected it to show 'connected'. The button clearly knows I am connected, why then the status contradicts this.

enter image description here

Furthermore, I then logout, and the button changes to 'Log in with Facebook'; then I attempt to log back in, which shows the Facebook Popup window; Upon entering the correct email/password combo, and clicking Login, I end back at my App's page, BUT the onlogin callback function (onlogin="callback_afterLogin") FIRES TWICE ! The first time, it shows the correct [status: "connected"] but the second time it shows [status: "unknown"], giving the appearance that I am logged out. There should be no reason for it to fire twice ?!

enter image description here

Furthermore, there is a .toLowerCase() error originating from the facebook sdk.js (see second screenshot).

Questioner
joedotnot
Viewed
69
分享
joedotnot 2019-12-18 18:39

You will still be able to use HTTP with “localhost” addresses, but only while your app is still in development mode.

The above quote comes from facebook staff from a blog post at https://developers.facebook.com/blog/post/2018/06/08/enforce-https-facebook-login/

I was relying on it to be truthful, but apparently IT SHOULD NOT BE TRUSTED and is the cause of the weird behaviour documented in my question.

As soon as I started using HTTPS ( https://localhost ), the sdk library behaves better:

  • initial status is now "connected"
  • callback still fires twice, but both times status is "connected"

A new error message appears in-between the firing twice callbacks:

You are overriding current access token, that means some other app is expecting different access token and you will probably break things. Please consider passing access_token directly to API parameters instead of overriding the global settings.

I tweaked the code slightly, thinking this would fix the firing twice problem:

//check if user is logged in... - AFTER facebook Login Popup returns.
function callback_afterLogin(response) {
    //REMOVED FB.getLoginStatus call, added `response` parm to callback signature
    console.log('callback_afterLogin:', response );
}

BUT it did not make a difference, still fires twice in succession, with error message in between. Please post your solution if you know why it fires twice.

ALSO NOTE the .toLowerCase() error remains, under certain conditions.

Ron C 2020-01-23 06:17:26

I too am seeing .toLowerCase() javascript error emited from the facebook sdk code when I call FB.getLoginStatus in development and the current site visitor isn't connected to FB yet. Crazy! Did you find a solution. I can't even trap the exception in a try catch, apparently because it's happening async after my try catch is fully executed. Any tips?

Related issues

1
Facebook Open Graph not clearing cache
2
web google auth doesn't work in facebook browser and messenger
3
Decoding facebook's blob video url
4
Programmatically change input value in Facebook's editable div input area
5
Want to save facebook image into my rails app
6
Facebook key hash does not match any stored key hashes
7
How to edit a facebook post in Python?
8
I can not access developers.facebook.com
9
How can i get audience size of exactly target ID?
10
Facebook graph api page post with multiple photos