如何解决本地主机的“idpiframe_initialization_failed”？

Question

这是我的初始化代码：

            function HandleGoogleApiLibrary() {
                // Load "client" & "auth2" libraries
                gapi.load('client:auth2', {
                    callback: function () {
                        // Initialize client & auth libraries
                        gapi.client.init({
                            apiKey: 'My API Key',
                            clientId: 'My Client ID',
                            scope: 'https://www.googleapis.com/auth/userinfo.profile https://www.googleapis.com/auth/userinfo.email https://www.googleapis.com/auth/plus.me'
                        }).then(
                            function (success) {
                                console.log("Yaaay");
                            },
                            function (error) {
                                console.log("Nope");
                                console.log(error);
                            }
                        );
                    },
                    onerror: function () {
                        // Failed to load libraries
                    }
                });
            }

这给了我以下错误消息：

details: "Not a valid origin for the client: http://127.0.0.1 has not been whitelisted for client ID 388774754090-o7o913o81ldb2jcfu939cfu36kh9h0q6.apps.googleusercontent.com. Please go to https://console.developers.google.com/ and whitelist this origin for your project's client ID."
error: "idpiframe_initialization_failed"

我的应用程序尚未投入生产，因此对于开发，我使用的是 localhost。事情是，在每一个堆栈溢出/引用我发现他们已经指定在Authorised JavaScript origins和Authorised redirect URIs我必须使用http://localhost代替http://127.0.0.1。如果我这样做，我会得到那个错误，Permission denied to generate login hint for target domain.如果我尝试登录。

如果我http://127.0.0.1在两者上都使用，我idpiframe_initialization_failed在初始化时没有得到任何结果，但是当我尝试登录时得到相同的权限被拒绝。

没有任何意义，没有其他方法可以指定本地主机，而且我无法使用 API。

Answer 1

就我而言，这是两个方面的问题。

1. 需要将原点添加到谷歌控制台。

   起源如何？http://本地主机

2. 清除缓存。

   这有时不起作用，您可能会开始认为这不是缓存问题。详情如下。

1.如何将您的来源添加到谷歌控制台？

• 去这里：https : //console.cloud.google.com/apis/credentials
• 在顶部选择您需要的项目。
• 查找OAuth 2.0 client IDs并在此部分中选择（或创建）一个客户 ID。
• 在打开的窗口中找到该部分Restrictions -> Authorized JavaScript origins并添加http://localhost或http://localhost:8000（指定您需要的端口）。

2.清除缓存。

如果步骤#1 没有解决问题，您需要清除缓存。

如果您只想删除localhost缓存，则Chrome可以通过以下方式进行：

• 打开设置->更多工具->开发者工具；
• 右键单击重新加载按钮 -> 清空缓存和硬重新加载。

有时缓存清除不起作用。为了确定它仍然是缓存问题，请使用隐身模式打开浏览器并再次检查您的站点。

Answer 2

为了节省未来的读者，我通过http://www.localhost在客户端 ID 创建（凭据/开发人员控制台）中准确输入“Authorized Javascript Origins”来设法从本地主机进行身份验证。完全不明显和反用户，但两者都没有http://localhost或http://127.0.0.1不起作用。