In my masterpage I have this code:
<body>
<div id="fb-root">
</div>
<script>
window.fbAsyncInit = function () {
FB.init({
appId: "xxx",
channelUrl: "/xd_receiver.htm",
xfbml: false
});
};
</script>
....
</body>
and in a separate .js file i have my facebook code like this:
var Facebook = function () {
var pub = {};
var priv = {};
pub.Login = function () {
return priv.FacebookLogin();
};
priv.FacebookLogin = function () {
FB.login(function (response) {
if (response.authResponse) {
FB.api('/me', function (response) {
console.log("you are logged in");
return response;
});
}
});
};
return pub;
};
Now my issue is that using the code like this, calling Login which calls FacebookLogin function will return the console msg that login is called before init even though init is right where fb says it should be, just after the tag.
I tested to put my init clal just above my FB.login and then it worked again so something is wrong with the placemet. Previously I had the js file (that contains the facebook functions) linked in within the tags but I did try to put it right after the init script as well but I got the same fault. (the calling of the facebook functions are in a js file which is linked in , does that matter?)
Any ideas why im getting this error message, FB.login() called before FB.init()?
The problem appeared to be the actual testing, when testing in localhost I had to rebuild the project which allowed me to use the login but if I just updated the page using F5 then i got the issue. Not 100% sure why but I worked around it by running after making changes.