javascript idpiframe_initialization_failed 在 Google 从本地主机登录
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/46472945/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
idpiframe_initialization_failed in Google Sign In from Localhost
提问by Shihan Khan
I'm trying to create a Google Sign In button by following this link. So far the account choose dialogue box is coming but after that I don't see any result in the console. Instead I'm getting this error at page load,
我正在尝试按照此链接创建一个 Google 登录按钮。到目前为止，帐户选择对话框即将出现，但之后我在控制台中看不到任何结果。相反，我在页面加载时收到此错误，
"idpiframe_initialization_failed", details: "Not a valid origin for the client: http://localhos…itelist this origin for your project's client ID."
details: "Not a valid origin for the client: http://localhost has not been whitelisted for client ID 386404527657-q4ss06np5g27dllq5ds7aif42udkh7e5.apps.googleusercontent.com. Please go to https://console.developers.google.com/ and whitelist this origin for your project's client ID."
- I've set Javascript Origins http://localhost& http://192.168.0.100:3000
- I've set Redirect URI http://localhost:8080/Callback& http://localhost:8080
- 我已经设置了 Javascript Origins http://localhost& http://192.168.0.100:3000
- 我已经设置了重定向 URI http://localhost:8080/Callback& http://localhost:8080
Here are the codes,
这里是代码，
<html lang="en">
<head>
<meta name="google-signin-scope" content="profile email">
<meta name="google-signin-client_id" content="YOUR_CLIENT_ID.apps.googleusercontent.com">
<script src="https://apis.google.com/js/platform.js" async defer></script>
</head>
<body>
<div class="g-signin2" data-onsuccess="onSignIn" data-theme="dark"</div>
<script>
function onSignIn(googleUser) {
// Useful data for your client-side scripts:
var profile = googleUser.getBasicProfile();
console.log("ID: " + profile.getId()); // Don't send this directly to your server!
console.log('Full Name: ' + profile.getName());
console.log('Given Name: ' + profile.getGivenName());
console.log('Family Name: ' + profile.getFamilyName());
console.log("Image URL: " + profile.getImageUrl());
console.log("Email: " + profile.getEmail());
// The ID token you need to pass to your backend:
var id_token = googleUser.getAuthResponse().id_token;
console.log("ID Token: " + id_token);
};
</script>
</body>
</html>
How can I get the results in my console?
如何在控制台中获取结果？
回答by Nathan Wailes
I was having this exact issue and this solutionworked for me.
我遇到了这个确切的问题，这个解决方案对我有用。
In short: clear your browser cache.
简而言之：清除浏览器缓存。
In Chrome: Settings → Advanced → Clear browsing data → Cached images and files
在 Chrome 中：设置 → 高级 → 清除浏览数据 → 缓存的图像和文件
回答by Cliff Coulter
The solution which worked for me was to whitelist the origin in the google developer console api for that application.
对我有用的解决方案是将该应用程序的谷歌开发者控制台 api 中的来源列入白名单。
回答by gergelykocse
I experienced this error on several sites that offer Google Sign in. I had to "allow" accounts.google.com cookie in the "show cookies and other site data" for the site to make it work (after reloading the page). Probably blocking 3rd party cookies in the browser was the root cause for first place,
我在几个提供 Google 登录的网站上遇到了这个错误。我必须在“显示 cookie 和其他网站数据”中“允许”accounts.google.com cookie 才能使其正常工作（重新加载页面后）。可能阻止浏览器中的第 3 方 cookie 是第一位的根本原因，
回答by Aidin
For me it was Settings > Site Settings > Cookies > "Blocked thrid-party cookies" must have been unchecked.
对我来说，设置 > 站点设置 > Cookie >“阻止的第三方 cookie”一定没有被选中。
