FB.init

From Facebook Developer Wiki (FbDevWiki.com)
Jump to: navigation, search

Method to initialize the library.

Typical initialization enabling most optional features:

 <div id="fb-root"></div>
 <script src="http://connect.facebook.net/en_US/all.js"></script>
 <script>
   FB.init({
     appId  : 'YOUR APP ID',
     status : true, // check login status
     cookie : true, // enable cookies to allow the server to access the session
     xfbml  : true  // parse XFBML
   });
 </script>

The best place to put this code is right before the closing </body> tag.

Asynchronous Loading

The library makes non-blocking loading of the script easy to use by providing the fbAsyncInit hook. If this global function is defined, it will be executed when the library is loaded:

<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 the server to access the session
      xfbml  : true  // parse XFBML
    });
  };

  (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>

The best place to put the asynchronous version of the code is right after the opening <body> tag. This allows Facebook initialization to happen in parallel with the initialization on the rest of your page.

Note: Some UI methods like stream.publish and stream.share can be used without registering an application or calling this method. If you are using an appId, all methods must be called after this method.

You can determine whether or not the FB library has loaded by looking at window.fbAsyncInit.hasRun. If window.fbAsyncInit.hasRun is true then the library has loaded (however, this doesn't indicate whether or not the FB.init() has been called yet).


If FB.init has not been called yet than FB._apiKey is null. Following code block checks _apiKey and initializes FB.

if(typeof(FB) === "object" && FB._apiKey === null) {   
    FB.init({
      appId  : 'YOUR APP ID',
      status : true, // check login status
      cookie : true, // enable cookies to allow the server to access the session
      xfbml  : true  // parse XFBML
    });
}

Custom Channel URL

This is an advanced option that can help address two specific known issues. First, when auto playing audio/video is involved, the user may hear two streams of audio because the page has been loaded a second time in the background for cross domain communication. Second, if you have frame busting code, then you would see a blank page. In these scenarios, you may provide the optional channelUrl parameter:

 <div id="fb-root"></div>
 <script src="http://connect.facebook.net/en_US/all.js"></script>
 <script>
   FB.init({
     appId  : 'YOUR APP ID',
     channelUrl  : 'http://example.com/channel.html'  // custom channel
   });
 </script>

The contents of the channel.html file should be this single line:

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

The channelUrl MUST be a fully qualified absolute URL. If you modify the document.domain, it is your responsibility to make the same document.domain change in the channel.html file as well. Remember the protocols must also match. If your application is https, your channelUrl must also be https. Remember to use the matching protocol for the script src as well. You MUST send valid Expires headers and ensure the channel file is cached by the browser. We recommend caching indefinitely. This is very important for a smooth user experience, as without it cross domain communication becomes very slow.

Important: If you do not specify a custom channelUrl, you should remove the following from your logs to ensure proper counts

  1. Matches against user-agent: "facebookexternalhit/*"
  2. Pageviews containing "fb_xd_bust" or "fb_xd_fragment"
  3. Track clicks from FB-hosted iframes separately from referrers (http://www.facebook.com/plugins/ http://www.facebook.com/plugins/like.php)

Parameters

Name Type Description
options Object
Property Type Description Argument Default Possible Values / Examples
appId String Your application ID. Optional null
cookie Boolean true to enable cookie support. Optional false
logging Boolean false to disable logging. Optional true
session Object Use specified session object. Optional null
status Boolean true to fetch fresh status. Optional true
xfbml Boolean true to parse XFBML tags. Optional false
channelUrl String Specifies the URL of a custom URL channel file. This file must contain a single script element pointing to the JavaScript SDK URL. Optional null
Personal tools
Namespaces
Variants
Actions
Navigation
Graph API
FQL
Toolbox