Google Auth API Javascript Chrome 上的 idpiframe 初始化错误

Question

我使用 GSuite，我正在编写一个非常简单的 Web 应用程序来使用 Google Auth API，但我得到一个异常 "idpiframe_initialization_failed".

现在我有了 google 示例中显示的确切 HTML： https://developers.google.com/api-client-library/javascript/samples/samples

1) 我在 Google Developer Console

上创建了一个项目

2) 我设置了 OAUTH 授权屏幕

3) 我已经创建了客户端 ID，创建了限制和重定向 URL

4) 我还创建了 API KEY

5) 最后我启用了人员 API，因为在设置 discoveryDocs 参数时发现服务失败

通过所有这些步骤，当我调用 gapi.client.init 时，它引发异常 仅在 chrome 中，我不明白为什么。

初始化API的代码是：

    gapi.client.init({
        apiKey: 'MY_API_KEY',
        discoveryDocs: ["https://people.googleapis.com/$discovery/rest?version=v1"],
        clientId: 'MY_CLIENT_ID.apps.googleusercontent.com',
        scope: 'profile'
    }).then(function (response) {
      // Listen for sign-in state changes.
      gapi.auth2.getAuthInstance().isSignedIn.listen(updateSigninStatus);

      // Handle the initial sign-in state.
      updateSigninStatus(gapi.auth2.getAuthInstance().isSignedIn.get());
    },function(reason){
        console.log('onerror');
        console.log(reason);
      // Listen for sign-in state changes.
      gapi.auth2.getAuthInstance().isSignedIn.listen(updateSigninStatus);

      // Handle the initial sign-in state.
      updateSigninStatus(gapi.auth2.getAuthInstance().isSignedIn.get());

代码是运行错误块，消息是：

details: "Failed to read the 'localStorage' property from 'Window': Access is denied for this document."
error:"idpiframe_initialization_failed"

知道我为什么会遇到这个错误吗？

谢谢！

Answer 1

我遇到了同样的问题。投入了一段时间后，找到了原因。此错误是因为在 chrome 设置中，您启用了阻止第三方 cookie 和站点数据选项。

可以通过禁用这个选项来解决： "To find the setting, open Chrome settings, type "内容设置”在搜索框中，点击内容设置按钮，查看Cookies下的第四项。” 取消勾选 "Block third-party cookies and site data".

希望这能帮助您解决问题。

Answer 2

就我而言，我只需要稍等一下 Google 就可以考虑来源。我无法准确说出花了多长时间。我等了大约 30 分钟。然后我就去睡觉了，第二天早上它就开始工作了。

编辑：糟糕，我刚刚意识到我使用的是 http:// 而不是 https://。那才是真正的问题。

Answer 3

我遇到了同样的问题，我搜索了 3 天：解决“popup_closed_by_user”转到您的 console.google 转到您的 API 管理：Credentials:modify 您的凭据:

授权Javascript产地（http://localhost:port）；授权重定向 URI(http://localhost:port/auth/google/callback);

例子：||授权Javascript来源(http://localhost:4200); 授权重定向 URI (http://localhost:4200/auth/google/callback)

Answer 4

问题在于 Google 的 API 控制台及其处理创建凭据的方式。它似乎只有在我通过以下 url 访问它时才有效 https://developers.google.com/identity/sign-in/web/sign-in#before_you_begin 有一个 link 可让您创建应用程序和 OAuth 凭据。当我转到控制台并通过该屏幕创建它时，它似乎不起作用。在再次尝试重新创建并使用新应用进行测试后，我发现您添加到授权 Javascript 来源的 URL 并不总是被添加。

如果一切正常，那么 url 应该可以在凭据页面中使用

Google Auth API Javascript Chrome 上的 idpiframe 初始化错误

Google Auth API Javascript idpiframe initialization error on Chrome

javascript

google-chrome

google-api-java-client

google-api-client