How to load javascript facebook api SYNCHRONOUSLY ...? - facebook

Question

I want to load facebook api ( javascript SDK) synchronously. I have seen this code on facebook developers.
<div id="fb-root"></div>
<script src="//connect.facebook.net/en_US/all.js"></script>
<script>
FB.init({
appId : 'YOUR_APP_ID',
channelUrl : '//WWW.YOUR_DOMAIN.COM/channel.html', // Channel File
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
</script>
and also on reference to another link
http://www.masteringapi.com/tutorials/facebook-javascript-sdk-best-practices/58/
is is mentioned that "But you need to make sure you don’t define FB in your own JS code or libraries!"...............
I am confused ....!
Please help me....

Answer 1

What you are doing looks fine.
The instruction that you've seen, "But you need to make sure you don’t define FB in your own JS code or libraries!" is simply a warning to not declare a variable named FB in your application, or you will hide the Facebook SDK.
In your code, on the very next line, you could begin making calls with FB.api or any of the other methods.
Does that help?

Answer 2

Add the below code after opening html tag
<div id="fb-root">
</div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId: 'Your APP ID',
status: true, // check login status
cookie: true, // enable cookies to allow server to access session
xfbml: true, // parse XFBML
oauth: true
});
};
(function() {
var e = document.createElement('script');
e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js';
e.async = true;
document.getElementById('fb-root').appendChild(e);
} ());
</script>
This code will load the javascript SDK asynchronously.