Facebook Javascript SDK Problem: "FB is not defined"

I saw a case where Chrome had installed WidgetBlock which was blocking the Facebook script. The result was exactly this error message. Make sure you disable any extensions that may interfere.

So the issue is actually that you are not waiting for the init to complete. This will cause random results. Here is what I use.

window.fbAsyncInit = function () {    FB.init({ appId: 'your-app-id', cookie: true, xfbml: true, oauth: true });    // *** here is my code ***    if (typeof facebookInit == 'function') {        facebookInit();    }};(function(d){    var js, id = 'facebook-jssdk'; if (d.getElementById(id)) {return;}    js = d.createElement('script'); js.id = id; js.async = true;    js.src = "//connect.facebook.net/en_US/all.js";    d.getElementsByTagName('head')[0].appendChild(js);}(document));

This will ensure that once everything is loaded, the function facebookInit is available and executed. That way you don't have to duplicate the init code every time you want to use it.

function facebookInit() {   // do what you would like here}

This error will also appear if you omit the semicolon after the fbAsyncInit definition.

window.fbAsyncInit = function() {    FB.init({        appId: 'YOUR APP ID',        status: true,        cookie: true,        xfbml: true    });    //do stuff}; //<-- semicolon required!

Without the semicolon, the situation is the same as in this shorter example:

var x = function () {    console.log('This is never called. Or is it?');}('bar');

The function gets called, because without the semicolon the ('bar') part is seen as a call to the function just defined.