Facebook Connect login button not rendering
- by tloflin
I'm trying to implement a Facebook Connect Single Sign-on site. I originally just had a Connect button (<fb:login-button>), which the user had to click every time they wanted to sign in. I now have the auto login and logout features working. That is, my site will detect a logged-in Facebook account and automatically authenticate them if it can find a match to one of my site's user accounts, and automatically deauthenticate if the Facebook session is lost. I also have a manual logout button that will log the user out of both my site and Facebook. All of those are working correctly, but now my original Connect button is intermittently not being rendered correctly. It just shows up as the plain XHTML (ie., it looks like plain text--not a button--and is unclickable), and no XFBML is applied. Here is the basic code:
On every page:
<body>
{...}
<script src="http://static.ak.connect.facebook.com/js/api_lib/v0.4/FeatureLoader.js.php" type="text/javascript"></script>
<script type="text/javascript>
FB.init('APIKey', '/xd_receiver.htm');
var isAuth; // isAuth determines if the user is authenticated on my site
// it should be true on the logout page, false on the login page
FB.ensureInit(function(){
var session = FB.Facebook.apiClient.get_session();
if (session && !isAuth) {
PageMethods.FacebookLogin(session.uid, session.session_key, FBLogin, FBLoginFail);
// This is an AJAX call that authenticates the user on my site.
} else if(!session && isFBAuth) {
PageMethods.FacebookLogout(FBLogout, FBLogoutFail);
// This is an AJAX call that deauthenticates the user on my site.
}
// the callback functions do nothing at the moment
});
</script>
{...}
</body>
On the login page: (this page is not visible to logged in users)
<body>
{...}
<script src="http://static.ak.connect.facebook.com/js/api_lib/v0.4/FeatureLoader.js.php" type="text/javascript"></script>
<script type="text/javascript>
FB.init('APIKey', '/xd_receiver.htm');
{...} // auto-auth code as on every page
</script>
<!-- This is the button that fails to render -->
<fb:login-button v="2" onlogin="UserSignedIntoFB();" size="large" autologoutlink="true"><fb:intl>Login With Your Facebook Account</fb:intl></fb:login-button>
<script type="text/javascript">
function UserSignedIntoFB() {
{...} // posts back to the server which authenticates the user on my site & redirects
}
</script>
{...}
</body>
On the logout page: (this page is not visible to logged out users)
<body>
{...}
<script src="http://static.ak.connect.facebook.com/js/api_lib/v0.4/FeatureLoader.js.php" type="text/javascript"></script>
<script type="text/javascript>
FB.init('APIKey', '/xd_receiver.htm');
{...} // auto-auth code as on every page
</script>
<script type="text/javascript">
function FBLoggedOut() {
{...} // posts back to the server which deauthenticates the user on my site & redirects to login
}
function Logout() {
if (FB.Facebook.apiClient.get_session()) {
FB.Connect.logout(FBLoggedOut); // logs out of Facebook if it's a Facebook account
return false;
} else {
return true; // posts back if it's a non-Facebook account & redirects to login
}
}
</script>
<a onclick="return Logout();" href="postback_url">Sign Out</a>
{...}
</body>
Some things I've already looked at:
The automatic login and logout are working great. I can log in and out of Facebook on another tab and my site will notice the session changes and update accordingly.
The logout seems to be working fine: when clicked, it deauthenticates the user and logs them out of Facebook, as intended.
The issue seems to usually happen after a Facebook user is logged out, but it happens somewhat intermittently; it might happen before they ever login, and it goes away after a few minutes/refreshes.
Some cookies are left over after the login/logout process, but deleting them does not fix the issue.
Restarting the browser does not fix the issue.
The user is definitely logged out of Facebook and my site when the problem occurs. I've checked for Facebook sessions and site authentication.
All external script calls are being served up correctly.
I have a suspicion that there's something else I need to be doing upon logout (like clearing session or cookies), but according to everything I've read about Facebook Connect, all I need to do is call the logout function (and deauthenticate on my server-side). I'm really at a loss; does anybody have any ideas what could be wrong?
