New Facebook Connect Login Experience

In order to make a more consistent and secure user experience when connecting accounts, we're changing the behavior of the dialog when a user connects accounts between your site and Facebook when the user is already logged in to Facebook. Previously, the Connect with Facebook dialog appeared in an IFrame "lightbox" within the browser window. After tomorrow's weekly code push, the dialog will pop up in a separate browser window, with an address bar, which matches the user login flow when the user is not logged in to Facebook and tries to connect accounts with your site. This will also make it easier for users to identify that the URL is trustworthy and coming from Facebook.

If the user has blocked browser popups, Facebook displays the following dialog, prompting the user to log in to Facebook. The user will then be directed to facebook.com to log in, and then back to your site after logging in to connect accounts. Users can also whitelist facebook.com for pop-ups.

If you're using the XFBML fb:login-button tag to render the dialog, you won't need to change anything. Depending upon how you initiate the login flow, your users may experience the process differently; however, this is not a breaking change.

If you trigger the login flow using JavaScript, you can only trigger the Connect dialog to pop up by way of a user-initiated event, which lets you circumvent popup blockers. For example, using an onclick handler on a button, input, or a tag (or any tag that prompts a user to take action, like the submit button in an HTML form) will allow the dialog to pop up as expected. For example, you can use an onclick handler like this:

<a onclick="FB.Connect.requireSession();">Connect</a>

Or, you can register the event in JavaScript (using DOM1 events here, or via your JavaScript library of choice):

<a id="do-fb-login">Connect</a>
<script>
  document.getElementById('do-fb-login').onclick = function() {
    FB.Connect.requireSession();
  };
</script>

You should avoid calling the login dialog by requiring a session on page load or any time the user has not performed an explicit action.

We always welcome your feedback. Please share it in the Developer Forum.

naitik, an engineer on the Facebook Platform team, is always thinking of new ways to help you connect.