FB.init has already been called - facebook

Question

I am building facebook iframe app. My application is loaded once (I receive signed_request once) and then I navigate through the pages in the iframe using internal domain links. I noticed that I see these strange messages both in Chrome and Firefox
FB.init has already been called - this could indicate a problem
I am pretty sure that this method is called only once and it seems Facebook wants me to call it once per application load (not once per page).
window.fbAsyncInit = function() {
FB.init({
appId: param('facebook_app_id'),
frictionlessRequests: true,
oauth: true,
channelUrl: site_url('/channel.html')
})
}
What error (if any) am I making here?

Answer 1

From the moment you pass parameters to the js.src like #xfbml=1&appId=X, FB SDK will auto init itself and thus FB.init will try to reinit..
So in your code, you don't have to remove the FB.init function, just make sure you don't pass parameters in the code that loads asynchronously the JS SDK.
Replace this:
js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&appId=X";
With :
js.src = "//connect.facebook.net/en_US/sdk.js";

Answer 2

If you really need to call init more than once you can do this:
FB._initialized = false;
FB.init();
but it makes no sense to me, I have a little bit different problem, but it is also related to FB.init has already been called - this could indicate a problem message.
I have AJAX-based website where after each page load I need to render XFBML from HTML that I get from AJAX request (comments, like button and other):
<div class="fb-comments" data-href="{REMOVED}" data-num-posts="5" data-width="760" colorscheme="dark"></div>
To do this, you can run this when you need to render XFBML:
FB.XFBML.parse();

Answer 3

I've also had this problem. I simply removed FB.init({...}) part and it started to work with following code:
window.fbAsyncInit = function () {
FB.Event.subscribe('auth.logout', function () {
// subscribe parts
});
// here is where fb.init() code was
};
(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/all.js#xfbml=1&appId=X";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
I guess it now auto inits code, so there is no need to do it manually. Now my code works again. I hope this helps.