user1108310
user1108310

Reputation: 249

how to fix Facebook JSDK that sometimes loads twice, once, or doesnt load at all?

Im using facebook javaSDK for my website and I have a weird problem. When I load the website with "internet explorer" it always runs fine. When I load the website with firefox it always loads TWICE, and when I use chrome the JSDK sometimes loads once and sometimes not loads at all , giving me the error "Uncaught ReferenceError: FB is not defined ". I tried using asynchronous loading for the SDK but still the same problem. btw I have firebug on firefox, could that be the reason the JSDK loads twice?

this is the code for loading the jssdk

<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
  appId      : '108437552626598', // App ID
  status     : true, // check login status
  cookie     : true, // enable cookies to allow the server to access the session
  xfbml      : true  // parse XFBML
});


};

 // Load the SDK Asynchronously
 (function(d){
 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.js";
 ref.parentNode.insertBefore(js, ref);
  }(document));
</script>

And Im trying to use FB.getlogin, im trying to integrete facebook opengraph in Wordpress site. Ive out my script right after I finish loading the main content This is the code

             </div><!-- end #content -->


<script type="text/javascript"      src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
 <script type="text/javascript">
 FB.getLoginStatus(function(response) {
 if (response.status == 'connected') {
alert('in');
window.facebooklogin = 'true';
    window.myValue = response.authResponse.accessToken;  
window.myId = response.authResponse.userID;
$('.userimage img').attr('src','http://graph.facebook.com/' + window.myId +         '/picture');
 $.ajax({ url: 'http://ballvids.com/check/admin_checkuser.php',
     data: {action: window.myId},
 dataType:'json',
     type: 'post',
     success: function(output) {
    if (output.message == 'true'){
        $('.thumbnail   img').attr('src',"http://ballvids.com/images/on2.png");
        alert(window.myValue);
        FB.api('/me/video.watches?video=<?php echo   urlencode(get_permalink($post->ID));?>&access_token='+window.myValue,'post',function(response) {
             if (!response || response.error) {
            alert(response.error.message);
            } else {
            alert(response.id);
            postID=response.id;
            showStuff('removeTimeline');
            }  
                });
    }else{

        $('.thumbnail img').attr('src',"http://ballvids.com/images/off2.png");
    }

        }
});
}else{
    alert('inside2');
    $('.thumbnail img').attr('src',"http://ballvids.com/images/off2.png");
    window.facebooklogin = 'false';
}

},true);

Thanks

Upvotes: 1

Views: 3948

Answers (2)

C3roe
C3roe

Reputation: 96412

When I load the website with firefox it always loads TWICE,

Try setting up a channel.html file and referencing it on initialization.

and when I use chrome the JSDK sometimes loads once and sometimes not loads at all , giving me the error "Uncaught ReferenceError: FB is not defined ".

If you had your calls to FB methods wrapped into window.fbAsyncInit that would not be possible, because that callback would never be called if the SDK wasn’t loaded. Conclusion: You didn’t, but instead you put your FB.getLoginStatus call somewhere else (which you still haven’t shown us in your code yet).

Upvotes: 1

Philip
Philip

Reputation: 5021

You have to call the FBLoginStatus(), inside the fbAsyncInit

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

    FB.getLoginStatus( function(response) {
        console.log(response);
    }, true);
};

If you have problems with the cached object returned from the FB.getLoginStatus() you have to pass a second parameter true.

Documentation: https://developers.facebook.com/docs/reference/javascript/FB.getLoginStatus/

Upvotes: 1

Related Questions