Question

I have a Facebook connect site and am having issues with the Facebook login part on mobile browsers (ie: iPhone Safari, etc). Whenever I click the login button, it opens a new tab in Safari which takes me to a URL like this: https://s-static.ak.fbcdn.net/connect/xd_proxy.php… followed by a bunch of extra hashes.

The problem is, this page doesn’t auto close and go back to my app. I have to manually close it and then go back. The login process works fine and the other page has already refreshed and loaded, but I can’t figure out why it’s not auto closing the XD Proxy page.

I’ve followed all the tutorials on Facebook for setting up the javascript code. I’m using FB.login() to actually login. It works flawlessly on the desktop. I’m wondering if this is a bug in Facebook’s javascript or not, but I can’t seem to figure it out. Any ideas would be very helpful.

Here is the code I’m using, for reference:

<script>
  window.fbAsyncInit = function() {
    FB.init({
      appId: "APP_ID",
      status: true, 
      cookie: true,
      oauth: true,
      xfbml: true
    });
  };

  (function(d, s, id) {
    var js, fjs = d.getElementsByTagName(s)[0];
    if (d.getElementById(id)) return;
    js = d.createElement(s); js.id = id;
    js.src = "//connect.facebook.net/en_US/all.js";
    fjs.parentNode.insertBefore(js, fjs);
  }(document, 'script', 'facebook-jssdk'));
</script>

<button onclick="loginToFB();" type="button" class="fb-login-button">Login with Facebook</button>

<script type="text/javascript">
  function loginToFB(next) {
    FB.login(function(response) {
      if (response.authResponse) {
         window.location = '/facebook';
      }
    }, {scope: 'SCOPE_STRING'});
  }
 </script>

Thanks!

Answer 1

Try first calling the getLoginStatus() function and don’t do FB.login() if the user is already logged in.