5

经过大量谷歌搜索没有找到解决方案如何捕获 google auth2 的窗口弹出阻止程序错误

在控制台错误中出现错误：“popup_blocked_by_browser”。我想要做的就是告诉用户应该为身份验证启用弹出窗口。

使用 window.open() 的样本不好，因为它们打开了无用的窗口。因为我看到很多人在寻找这个。

有什么建议吗？

4

4 回答 4

11

有同样的问题。似乎浏览器（或至少 chrome）将阻止任何“window.open”调用，它不是作为用户交互的一部分调用的。

请参阅此处以获得更深入的解释。

__

我曾经在点击事件侦听器中有下一个代码：

gapi.load('auth2', function() {
  var auth2 = gapi.auth2.init({
    client_id: '.apps.googleusercontent.com',
    fetch_basic_profile: true,
    scope: 'profile'
  });
  auth2.signIn()
    .then(function() {
      var profile = auth2.currentUser.get().getBasicProfile();
      ... 
    })
    .catch(function(err) { ... });
});

请注意加载“auth2”的异步方式，这是谷歌文档所说的。

我将其更改为：

// way earlier, before click event can happen
// we call the gapi.load method.
gapi.load('auth2', function() {});

然后，在 click 事件处理程序中，我们可以执行以下操作：

var auth2 = gapi.auth2.init({
    client_id: '.apps.googleusercontent.com',
    fetch_basic_profile: true,
    scope: 'profile'
  });
  auth2.signIn()
    .then(function() { ... })
    .catch(function(err) { ... });

...所以浏览器不会阻止谷歌登录弹出窗口

于 2017-11-28T07:26:29.780 回答
1

最后！！signIn() 方法使用 JS Promise。所以可以使用的代码是：

gapi.auth2.getAuthInstance().signIn().then(function(){}, function(error){ if (error) alert('please allow popup for this app')})

希望这会有所帮助！

于 2017-08-10T23:10:10.973 回答
1

在您的构造函数（服务）或 ngOnInit（用于组件）中执行以下操作：

 googleAuthService.getAuth().subscribe(
  (auth) => {
    this.googleAuth = auth;
  });

然后，在您的登录功能中，调用：

    this.googleAuth.signIn()
  .then((user) => {
      this.signInSuccessHandler(user as GoogleUser);
    },
    (error) => console.error(error));
于 2018-07-27T12:54:01.897 回答
0

更新：

现在您需要使用Firebase 身份验证

https://firebase.google.com/docs/auth/

回答：

对我来说，我将 init 方法更改为有一个回调函数（空的）......方法如下：

错误（浏览器阻止弹出窗口）（没有回调功能）：

.init({ client_id: main.clientId })

像魅力一样正确工作：

.init({ client_id: main.clientId, () => { } })
于 2018-07-31T12:34:09.190 回答