FB.login dialog does not close on Google Chrome

Question

I\'m calling FB.login() on a click event in my application. The dialog pops up as expected, but when the user is done logging into Facebook (and/or authorizing

Answer 1

I got a similar call to FB.login() to close the dialog box by changing

onclick="dologin()"

to

onclick="dologin(); return false;"

Answer 2

I had the same exact problem. I did two things, first I added this line right before the FB.init() call:

FB.Flash.hasMinVersion = function () { return false; };

Then I went into the FB app page and added the Site Domain (i.e. test.com).

I think the site domain setting was the key, but I am not 100% positive. All I know is that it seems to always close now in all browsers including Chrome.

Answer 3

Calling this snippet after FB.init fixed the issue for me. But other solutions seem to have worked for different cases.

$.browser.chrome = /chrome/.test(navigator.userAgent.toLowerCase());
if ($.browser.chrome || $.browser.msie) {
    FB.XD._origin = window.location.protocol + "//" + document.domain + "/" + FB.guid();
    FB.XD.Flash.init();
    FB.XD._transport = "flash";
  } else if ($.browser.opera) {
    FB.XD._transport = "fragment";
    FB.XD.Fragment._channelUrl = window.location.protocol + "//" + window.location.host + "/";
  }

Answer 4

I've been experiencing the same issue in IE9, and it seemed to stem from upgrading to Flash Player 10. The answers suggested already did not work for me and I'd lost hope in trying to fix it since finding an open bug at Facebook covering it. But Henson has posted an answer on a similar question that fixed it for me. In the JavaScript in my site master I removed these lines

    FB.UIServer.setLoadedNode = function (a, b) {
       //HACK: http://bugs.developers.facebook.net/show_bug.cgi?id=20168
        FB.UIServer._loadedNodes[a.id] = b;
    };

and now it works. (N.B. I have not checked to see if the IE8 issue those lines were intended to overcome returns.)

Answer 5

Given the age of this post, I am guessing that the poster has solved this; however, given that this is also a resource for others searching to resolve similar issues, I thought that I would include my experience just in case.

I found out that what was causing this same issue symptom for me was accidentally forgetting to include event.preventDefault(); in my "click" listener handler in jQuery. The facebook login dialog was popping up and allowing me to log in but not disappearing. The issue was that the website was performing the default form post action, which was interfering with the facebook call-back function.

Answer 6

Short answer relating to question above:

Load the all.js script over https.

<script src="https://connect.facebook.net/en_US/all.js"></script>

Longer answer if you are troubleshooting a similar issue to the original question:

Use Google Chrome to attempt the login. Once you have logged in and have the blank pop-up window hanging up on the screen, press F12. This brings up the developer tools for Chrome. Click the Console tab, and you will hopefully see the error. What you will likely see is related to XD (cross-domain) issues.

Even if your particular issue is different from the issue I was having, the above should lead you in the right direction.

My issue/solution was specific the Facebook C# SDK v6 documentation - the tutorial code loads the all.js script using a URL that begins with // - which then loads the script from the same scheme as my site (which was http). After I logged in, the pop-up tried to redirect me back from the https Facebook login to my http site and bingo, we have the XD issue. The solution was to specifically load the scripts from https://connect.facebook.net/en_US/all.js as follows:

  // Load the SDK Asynchronously
  (function(d){
     var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];
     if (d.getElementById(id)) {return;}
     js = d.createElement('script'); js.id = id; js.async = true;
     js.src = "https://connect.facebook.net/en_US/all.js";
     ref.parentNode.insertBefore(js, ref);
   }(document));

Edit:

After some consideration, this approach of allowing a redirect to http might compromise the security of the system by allowing the data in that request to be read by someone else and then to be re-used. I couldn't find any relevant documentation or examples and so I could not conclude one way or another, YMMV.