12

I am using a Facebook login method in my code on page load, but when I execute this code, the pop-up blocker closes the Facebook permission window.

How can I open this window with Javascript without needing to make an exception in the pop-up blocker?

Below is my code:

FB.login(function(response)
{
    if(response.session!=null)
    {
        window.location.href='http://example.com';
    }
},
{ perms: 'email,user_birthday,publish_stream' });
Michael Gaskill
  • 7,913
  • 10
  • 38
  • 43
Seema
  • 787
  • 2
  • 14
  • 25
  • Anyone have a idea to show facebook permission popup in iframe ,It may be solved popup blocker problem. Have any?? – Seema Feb 10 '11 at 11:52
  • See possible answer here: http://stackoverflow.com/questions/11779955/can-you-call-fb-login-inside-a-callback-from-other-fb-methods-like-fb-getlogins/12851737#12851737 – sprockett Oct 12 '12 at 06:21

5 Answers5

20

You can do something like -

var uri = encodeURI('http://example.com');
FB.getLoginStatus(function(response) {
      if (response.status === 'connected') {
                window.location.href=uri;
      } else {
         window.location = encodeURI("https://www.facebook.com/dialog/oauth?client_id=YOUR_APP_ID&redirect_uri="+uri+"&response_type=token");
      }

This will just redirect directly instead of opening a pop-up

Rahul
  • 1,495
  • 1
  • 15
  • 25
  • interesting, but where do you ask for specific permissions like "{perms:'email,user_birthday,publish_stream'}"? – xus Jul 09 '12 at 06:51
  • 1
    In the redirect oauth URI, using an extra GET parameter 'scope'. Check https://developers.facebook.com/docs/reference/dialogs/oauth/ – Rahul Jul 20 '12 at 10:16
15

This is specifically denied in the documentation:

"You should only call this on a user event as it opens a popup. Most browsers block popups, unless they were initiated from a user event, such as a click on a button or a link."

It's also simply poor UX.

dubilla
  • 882
  • 7
  • 10
  • I strongly disagree that this is "simply poor UX." It's less obtrusive to avoid a popup, _especially_ in the case where the user is _already_ connected to Facebook, where a popup quickly appears and disappears. I would argue that it's better UX design to redirect for oauth rather than open a popup. – thisguyheisaguy Jan 05 '18 at 02:56
  • Nevermind my above comment... what I was saying was with regards to a user-initiated interaction, I hadn't paid attention to the fact that the OP was looking for a way to _clandestinely_ authorize them via Facebook. – thisguyheisaguy Jan 05 '18 at 02:58
6

Yeah you need to call it with a user event, but strictly the onclick event, not any other:

<a href="#" onclick="fbLogin()"> Login</a> <!-- works -->

<a href="#" onmousedown="fbLogin()"> Login</a> <!-- doesnt work -->

<a href="#" onmouseup="fbLogin()"> Login</a> <!-- doesnt work -->
jeremy
  • 9,965
  • 4
  • 39
  • 59
Enmanuel Hernandez
  • 61
  • 1
  • 1
6

There'd be no point in popup blockers existing if you could just code around them. You'll either need to find a method that doesn't use a popup or require some user interaction with the browser to open the popup.

Anthony Grist
  • 38,173
  • 8
  • 62
  • 76
  • I don't want to use user interaction, bcoz after click on my invitation link invitee go on my home where i want to showing facebook permission popup without any user interaction. – Seema Feb 10 '11 at 11:35
5

If you try to open a popup automatically then there is a high possibility that popup blockers will become activated, as far as I know, it has to be based on some User action, for example click of a button. Try to execute this code on click of a button, it should work.

Arnab
  • 736
  • 5
  • 14