【发布时间】:2017-01-28 09:44:09
【问题描述】:
我希望用户能够在其网络浏览器中使用他的 Google 帐户登录。但是,没有调用 data-onsuccess 方法。
我将带有登录代码的 .html 文件上传到我的网站空间,并使用相关设置创建了一个 Google API 项目。我可以看到登录按钮。我可以单击它并输入我的 Google 帐户数据并允许我的应用程序访问我的帐户。但是,没有调用 data-onsuccess 方法,因此我无法对成功登录做出反应。
我尝试使用来自 Google 的 umodified example code 和我自己的代码登录,我在其中添加了一些调试以查看 JS 是否正常工作:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="google-signin-scope" content="profile email">
<meta name="google-signin-client_id" content="CORRECT_VALUE_HERE.apps.googleusercontent.com">
<script src="https://apis.google.com/js/platform.js" async defer></script>
<title>Google sign in test</title>
</head>
<body>
<h1>Google sign in test</h1>
<div class="g-signin2" data-onsuccess="onSignIn"></div>
<br>
<a href="#" onclick="signOut();">Sign out</a>
<br>
<a href="index.html">Back</a>
<br>
<a href="#" onclick="someTest()">JavaScript Test</a>
<br>
<ul>
<li id="gID">Google ID, temporary</li>
<li id="gFullName">Full Name</li>
<li id="gGivenName">Given Name</li>
<li id="gFamilyName">FamilyName</li>
<li id="gImg">Image URL</li>
<li id="gEMail">E-Mail</li>
<li id="gToken">Google Token, permanent</li>
</ul>
<script>
function onSignIn(googleUser) {
alert('in onSignIn');
// Useful data for your client-side scripts:
var profile = googleUser.getBasicProfile();
document.getElementById('gID').textContent = profile.getId();
document.getElementById('gFullName').textContent = profile.getName();
document.getElementById('gGivenName').textContent = profile.getGivenName();
document.getElementById('gFamilyName').textContent = profile.getFamilyName();
document.getElementById('gImg').textContent = profile.getImageUrl();
document.getElementById('gEMail').textContent = profile.getEmail();
// The ID token you need to pass to your backend:
var id_token = googleUser.getAuthResponse().id_token;
document.getElementById('gToken').textContent = id_token;
};
function someTest() {
alert('js is working');
var x = {};
x.getBasicProfile = function() {
var y = {};
y.getId = function() { return 'fake id'; };
y.getName = function() { return 'fake fake full name'; };
y.getGivenName = function() { return 'fake fake given name'; };
y.getFamilyName = function() { return 'fake fake family name'; };
y.getImageUrl = function() { return 'fake image'; };
y.getEmail = function() { return 'fake e-mail'; };
return y;
};
x.getAuthResponse = function() {
var z = {}
z.id_token = 'fake id token';
return z;
};
onSignIn(x);
};
function signOut() {
var auth2 = gapi.auth2.getAuthInstance();
auth2.signOut().then(function () {
console.log('User signed out.');
});
};
</script>
</body>
</html>
我在浏览器或 http 服务器中没有看到任何错误消息。谁能告诉我我做错了什么?
我已经尝试/检查过的事情:
- 我多次检查元标记中的 client_id 是否正确。
- 我确定我设置了正确的“Authorized JavaScript origin”。否则我会在登录屏幕中看到错误消息。
- 我确定我使用了正确的登录名。我可以在我的 google 帐户设置中的授权站点中看到我的示例应用程序。
- 我尝试将脚本标签移到 div 标签上方。没关系。我确定 onSignIn() 是一个顶级 JS 函数。
- 我尝试在其他地方托管此 .html 文件(以防 Heroku 以某种方式阻止此过程)。它没有帮助。
- 我在 Linux 和 Windows 上使用最新的 Firefox 和 Chrome 进行了尝试。没有区别。
【问题讨论】:
标签: google-signin