Problem with facebook connect button in chrome (we are using django and django-socialauth)

Question

We are using django and django-socialauth for auth with google/fb/twitter but there is a problem with the facebook connect button only in chrome (neither safari), dont shows the button.

Answer 1

Hah - I found this post about 3h after you posted it via a Google search, had a related problem using django-socialauth where the button was showing up but not logging the user in successfully if they were already logged in on Facebook.com.

Used the following code to fix it, which includes hardcoding the connect button image so should solve your issue too (Detects webkit and logs the user out first, which fixes my issue. Since the bug only affected webkit and logging out first isn't great for users I wanted to keep the standard behaviour for other browsers - I used jQuery for browser detection but you could use another way or simply skip the IF in the Javascript and use the logout-first behaviour for all browsers)

<a href="#" onclick="if ($.browser.webkit || $.browser.safari) { FB.Connect.logout(function(){FB.Connect.requireSession(facebook_onlogin);return false;}); } else { FB.Connect.requireSession(facebook_onlogin); }; return false;">
    <img id="RES_ID_fb_login_image" src="http://static.ak.fbcdn.net/rsrc.php/zA114/hash/7e3mp7ee.gif" alt="Connect">
</a>

Answer 2

If you have a custom buttom for fb you can use the facebook middleware for fix this:

add this to your MIDDLEWARE_CLASSES in settings.py:

...
'facebook.djangofb.FacebookMiddleware',
...