FB.init gives 'root undefined' or 'innerHTML' error - facebook

I have written a Facebook website app that gives the possibility to push reactions that people give to news items to there Facebook wall. Everything works fine except in IE8.
When I visit the homepage with IE9 compatibility mode IE8 I get:
Unable to set value of the property 'innerHTML': object is null or undefined
When visit with authentic IE8 I get:
'root' is null or not an object
This is the Facebook code I have on that page:
<script src="http://connect.facebook.net/en_US/all.js"></script>
<div id="fb-root"></div>
<script>
FB.init({
appId : '${siteConfiguration.facebookAppId}',
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
</script>
I have tried putting the script tags in the and the fb-root in the but I still get the error.

It was right in front of me!
FB quote: The best place to put this code is right before the closing </body> tag.
I placed it in the <head> tag.

Guess you need to reorder your code put the line
afer
so your code now will be
<div id="fb-root"></div>
<script src="http://connect.facebook.net/en_US/all.js"></script>
<script>
FB.init({
appId : '${siteConfiguration.facebookAppId}',
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
</script>

Related

We are getting a permission denied error in IE8. facebook-graph-api

We are getting a permission denied error in IE8. It happens after the FB.init. We have tried the channelUrl fix. We have put the as the first tag after the body. We have tried the document.domain in both the script and in the channel.html. We have tried the FB.UIServer.setActiveNode workaround.
It works fine in IE9, FF, Chrome and Safari.
<div id="fb-root"></div>
<script src="//connect.facebook.net/en_US/all.js"></script>
<script type="text/javascript">
var myUserId;
document.domain = 'XXXX.XXXX.com';
window.fbAsyncInit = function() {
FB.init({ appId: 'XXXXXXXXX',
status: true,`enter code here`
cookie: true,
xfbml: true,
channelUrl: 'http://XXX.XXXX.com/channel.html'
});
FB.UIServer.setActiveNode = function(a, b) { FB.UIServer._active[a.id] = b; } // IE hack to correct FB bug
I am getting an permission denied error in IE8 in a facebook-iframe for a tab app on a facebook-fanpage. Any ideas how to fix this?
This worked for me:
FB.init({
appId: 'xxxxx',
appSecret: 'xxxxxxxxx',
status: true
cookie: true
});
// this code solves the issue
FB.UIServer.setLoadedNode = function (a, b) {
FB.UIServer._loadedNodes[a.id] = b;
};
As seen here http://ikorolchuk.blogspot.com/2011/09/facebook-javascript-sdk-security-error.html?showComment=1323866805727#c7681567069563597438
I'd suggest attaching the debugger and posting exactly where the error occurs. If its related the Facebook Proxy it might be a temporary issue with Facebook.
A couple of suggestions ( not mentioned above ):
1/ Try adding FBML to your html tag:
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://www.facebook.com/2008/fbml" xml:lang="en">
2/ Try disabling compatibility mode options if your are accessing a test server that might be considered an intranet site ( generally same subnet ).
It is possibly because you redirect to a HTTP page while your current iframe is https.
The protocol of the iframe can be https, maybe because of an internal redirect, even if the Facebook page is http.

Where to download FaceBook JavaScript SDK and xd_receiver.htm

I have experience with PHP and JavaScript, but am new to using the FaceBook API. I'm carefully reading through the documentation, but notice thta lot of links within their documentation are broken. For example, the link for http://api.facebook.com/static/xd_receiver.htm is broekn and I need that content to be able to do almost anything with the FB API. Seriously, these guys seem to have really dropped the ball with their documentation. Does anyone know where I can get this file and the rest of the JavaScript SDK? Thanks.
<div id="fb-root"></div>
<script src="//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
channelUrl : 'http://WWW.MYDOMAIN.COM/channel.html', // channel.html file
oauth : true // enable OAuth 2.0
});
</script>
The contents of the channel.html file should be this single line:
<script src="//connect.facebook.net/en_US/all.js"></script>
You don't necessarily download it yourself so much as load it when you want to use it.
Here's a link to the quickstart
https://developers.facebook.com/docs/javascript/quickstart/v2.0
Here is the documentation that facebook has for their Javascript SDK. There are some areas that are poor (to put it lightly), but most of it is there, or in the comments/forums created by users

Facebook login, redirect_uri is not owned by the application. why?

I can't add FB login to my site. I simply registered the application:
URL: http://www.chusmix.com/
DOMAIN: www.chusmix.com
And then I pasted the login code and replaced my APP id in it:
<html>
<head>
</head>
<body>
<div id="fb-root"></div>
<script src="http://connect.facebook.net/en_US/all.js"></script>
<script>
FB.init({
appId:'212044715486306', cookie:true,
status:true, xfbml:true
});
</script>
<fb:login-button>Login with Facebook</fb:login-button>
</body>
</html>
However when clicking the login button I get Error 191: redirect_uri is not owned by the application
Also this code is in the page: http://www.chusmix.com/game/ according to what Facebook says filling the field DOMAIN makes all pages in the domain able to use Facebook Authorization. However I also tried pointing directly to the domain where the Login Button is and I get the same error.
There isn't even a redirect url.
Update: It seems the Login works in http://www.chusmix.com/game/ but doesn't on http://chusmix.com/game/ (without www).
Is there a way to make it work if the user doesn't type www.? Or do I have to use a redirect?
Try adding the site URL to the app settings Edit Settings->Web Site->Site URL. While you are there you might as well fill in the Site Domain in case you add sub domains in the future.
Use this as you Site Domain: chusmix.com
Make sure every URL in your JS script matches EXACTLY to the Site URL you set up in Facebook, including http://.
Ex:
FB.init({
appId : '128957350986', // App ID
channelUrl : 'zazzlebaytobreakers.com/lib/channel.php', // Channel File
Will cause this error in IE 7 and 8.
Make sure it's:
FB.init({
appId : '128957350986', // App ID
channelUrl : 'http://zazzlebaytobreakers.com/lib/channel.php', // Channel File

FB.logout not working in IE8

I've integrated facebook login with my application and I want to logout the user from facebook when he logs out of my application. So I did the following:
Logout
This works on Firefox and Chrome but doesn't work on IE8. In IE8 the user is logged out of the application but is not logged out of Facebook.
Anyone else experiencing this?
Please try this one
<script src="http://connect.facebook.net/en_US/all.js"></script>
<div id="fb-root"></div>
<script language="javascript" type="text/javascript">
FB.init({
appId: '205734987138498',
status: true, // check login status
cookie: true, // enable cookies to allow the server to access the session
xfbml: true, // parse XFBML
oauth: true // enable OAuth 2.0
});
function handleSessionResponse(response) {
// FB.XFBML.parse();
}
FB.getLoginStatus(handleSessionResponse);
//////you can optionally put the following in a seprate js file/////////
var Facebook = {}
Facebook.signout = function (url) {
FB.logout();
setTimeout('top.location.href = "' + url + '"', 2000);
}
</script>
<div onclick="Facebook.signout('http://www.uamplify.com');">Call your logout function now, click here</div>
I found the exact same thing and also with the Android browser. Shahid's fix worked for me and then I realized another approach would be to put the redirect within the callback function like this:
function mysignout(url)
{
FB.logout(function()
{
top.location.href = 'url'
});
}
If you're like me, you probably figured FB.logout is just destroying a cookie or something but it appears to make some ajax calls (I guess to revoke authentication on the server) and has different execution times, especially on mobile devices using wireless networks.
2000 ms might not necessarily be enough time for the function to complete, or it could be more than necessary. The callback function executes once FB.logout has completed in every case.

Facebook connect ifUserConnected() does not work - FB.Connect is undefined error

I'm trying to integrate Facebook connect to my website. The login button appears and i'm able to login. The profile picture and the name is displayed properly. However when I try adding the code FB.Connect.ifUserConnected, I get a error message saying FB.Connect is not defined.
This is what I'm doing
<div id="fb-root">
</div>
<script src="http://connect.facebook.net/en_US/all.js"></script>
<script type="text/javascript">
FB.init({ appId: 'my app id', status: true, cookie: true, xfbml: true });
</script>
<fb:login-button onlogin="fb_login()"></fb:login-button>
<script>
function fb_login() {
$("#SocialConnectButtons").hide();
$("#UserProfile").show();
FB.XFBML.Host.parseDomTree();
}
//ALL UNTIL HERE WORKS AS EXPECTED, BUT THE FOLLOWING LINE FAILS
FB.Connect.ifUserConnected(fb_login);
</script>
Thanks for the help
Here is a good tutorial to get started with new API for facebook connect.
You are using the new Graph API (http://connect.facebook.net/en_US/all.js)
The code you wrote will not work. Check the Graph API javascript SDK here: http://developers.facebook.com/docs/reference/javascript/
and for the API itself:
http://developers.facebook.com/docs/reference/api/