Facebook Connect API not populating user data when facebook-logo="true" option is used
I'm working on a Facebook Connect app. I have the Connect button up and running and users can successfully authenticate via Facebook. However, I'm having trouble getting their profile picture and name to displ开发者_运维技巧ay with XFBML. Here is what I'm doing:
<script type="text/javascript">
function fb_login_handler() {
var userbox = document.getElementById( "fb_userbox" );
userbox.innerHTML =
"<span>"
+ "<fb:profile-pic uid=loggedinuser facebook-logo='true'></fb:profile-pic>"
+ "Welcome, <fb:name uid=loggedinuser useyou='false'></fb:name>"
+ "</span>";
FB.XFBML.Host.parseDomTree();
}
</script>
...
<div id="fb_userbox">
<fb:login-button onlogin="fb_login_handler();" autologoutlink="1" length="long"></fb:login-button>
</div>
...
<!-- Facebook Connect initialization -->
<script src="http://static.ak.connect.facebook.com/js/api_lib/v0.4/FeatureLoader.js.php/en_US" type="text/javascript">
</script>
<script type="text/javascript">
FB.init("[MY_API_KEY]", "/xd_receiver.htm",
{ "ifUserConnected" : fb_login_handler } );
</script>
I can successfully login with the Connect button, and the Javascript callback gets run, but I just end up with this:
http://www.friedo.com/fbuserbox.png
So neither the picture nor the name is getting populated. The same thing happens even if I hardcode my FB profile ID in place of loggedinuser.
Update: It seems (after randomly messing around) that I can get it to work if I turn off the facebook-logo attribute from the fb:profile-pic tag. Setting it to false (or removing it) causes the user box to render correctly. But I need to Facebook logo to work, too. :(
The exact markup that you have works fine under this test console. Are you sure you're not getting any JavaScript errors?
Also, can you test with the uid of a relatively old user. There seems to be a bug with displaying pictures for new users. My uid doesn't seem to have this problem, if you want to test it out with mine: 685184151
I tried this code in my server, it works perfectly, I get my name and picture with the fb logo, I tried it in IE8, Chrome 4.0, Safari 3.21 and Firefox 3.5, all with success.
You have to add these tags, so that the FBML tags works in IE, Safari and maybe some versions of the other browsers.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://www.facebook.com/2008/fbml">
I wanted to paste the whole script so you could see it, but am new to this site so I don't know how ( the code tag didn't work ). I didn't make any changes to your code, just added the tags I mentioned above along with the body and head tags.
加载中,请稍侯......
精彩评论