FB init function gives wrong version error

I'm using the Facebook JS sdk, and I have created a new App today. Everything is configured properly. Using init function like:

window.fbAsyncInit = function() {
    FB.init({
      appId      : 'xxxx', // App ID
      status     : false, 
      version:  'v2.0',
      cookie     : true, 
      xfbml      : false  // parse XFBML
    });
};

    (function(d, s, id){
         var js, fjs = d.getElementsByTagName(s)[0];
         if (d.getElementById(id)) {return;}
         js = d.createElement(s); js.id = id;
         js.src = "//connect.facebook.net/pl_PL/sdk.js";
         fjs.parentNode.insertBefore(js, fjs);
       }(document, 'script', 'facebook-jssdk'));

but I have an error: "Uncaught Error: init not called with valid version " Was trying also other versions like: 2.1, 2.2 and still no luck. What am I doing wrong here?

**Disclaimer - This is purely speculation. Seems to have solved my problem.

I've had this issue on a recent project. I think this is a latency issue. The Facebook SDK requires that <div id="fb-root"></div> be on the page. This should be the first thing after the opening body tag. After this, you may see your initialization code.

For me, this issue was not consistent. I would occasionally see the bug and sometimes I would not. Thus, my conclusion of it being a latency problem. If the SDK cannot find the fb-root, then it must create one. Herein, is where I believe the latency issue exists.

Try adding this just after your opening body tag, but before your FB.init({});.

<div id="fb-root"></div>

This seems to have solved the issue for me and will hopefully help others as well. The v1.0 documentation discusses the reason for fb-root, but the v2.0 docs make no mention of the item, likely because the init script will add it for you if it does not find it.

I got it working by using all.js instead of sdk.js.
In your case, it would look like:

js.src = "//connect.facebook.net/pl_PL/all.js";

instead of

js.src = "//connect.facebook.net/pl_PL/sdk.js";

Add &version=v2.0 to js.src, as follows:

(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.0";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));

This problem plagued me for a while. I tried many of the ideas listed here such as changing the version number and moving/removing the fb-root.

What is finally working well for me is to delete the entire window.fbAsyncInit function and specify the init properties in the hash of sdk.js. For example:

<script type="text/javascript">
    (function(d, s, id){
        var js, fjs = d.getElementsByTagName(s)[0];
        if (d.getElementById(id)) {return;}
        js = d.createElement(s); js.id = id;
        js.src = "https://connect.facebook.net/en_US/sdk.js#version=v2.2&appId=12345&status=true&cookie=true&xfbml=true";
        fjs.parentNode.insertBefore(js, fjs);
    }(document, 'script', 'facebook-jssdk'));
</script>

Of course you may omit a parameter to use its default value.

I can't find this approach documented anywhere so use it at your own risk. Luckily I was upgrading an older site from v1.x to v2.x and it used this technique when loading all.js.

i replaced this

js.src = "//connect.facebook.net/en_US/sdk.js";

with this

js.src = "//connect.facebook.net/en_US/all.js";

and worked :)

FB init function gives wrong version error

Related

Recent Posts