Запретить блокировку всплывающих окон

Я использую метод входа в Facebook в своем коде при загрузке страницы, но когда я выполняю этот код, всплывающий блокиратор закрывает окно разрешения Facebook.

Как я могу открыть это окно с помощью Javascript без необходимости делать исключение в блокировщике всплывающих окон?

Ниже мой код:

FB.login(function(response)
{
    if(response.session!=null)
    {
        window.location.href='http://example.com';
    }
},
{ perms: 'email,user_birthday,publish_stream' });

Ответ 1

Вы можете сделать что-то вроде:

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");
      }

Это будет просто перенаправлять непосредственно, а не открывать всплывающее окно

Ответ 2

Это специально запрещено в документации:

"Вы должны вызывать это только в пользовательском событии, так как оно открывает всплывающее окно. Большинство браузеров блокируют всплывающие окна, если они не были инициированы из пользовательского события, например, щелчок по кнопке или ссылке.

Это также просто плохой UX.

Ответ 3

Не было бы смысла в блокировках всплывающих окон, если бы вы могли просто кодировать их. Вам нужно будет либо найти метод, который не использует всплывающее окно, либо потребовать от пользователя взаимодействия с браузером, чтобы открыть всплывающее окно.

Ответ 4

Если вы попытаетесь открыть всплывающее окно автоматически, то существует высокая вероятность того, что блокировки всплывающих окон станут активными, насколько я знаю, это должно быть основано на некоторых действиях пользователя, например, нажатие кнопки. Попробуйте выполнить этот код одним нажатием кнопки, он должен работать.

Ответ 5

Да, вам нужно вызвать его с помощью пользовательского события, но строго это событие onclick, а не любое другое:

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

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

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