web网站JavaScript接入谷歌登录

gyue2345·2021-08-24·341 次阅读··

   评分 3 次，平均分 3.7 ：    抢沙发   隐藏边栏   黑色模式

JavaScript 方法，Google 申请地址：https://console.cloud.google.com/apis/dashboard

• 通过单击“创建新项目”来创建新应用程序。
• 转到 API 项目下的 API 访问。
• 之后，单击“创建 OAuth 2.0 客户端 ID”以创建新应用程序。
• 将出现一个名为“创建客户端 ID”的弹出窗口，填写任何必填字段，如应用程序名称和描述，然后单击下一步。
• 在弹出窗口中，将应用程序类型设置为Web应用程序，然后单击（更多选项）切换到高级设置。
• 提供 URL 作为应用程序的回调 URL。

function google_login() {
var googleUser = {};
gapi.load('auth2', function(){
// Retrieve the singleton for the Google Auth library and set up the client.
auth2 = gapi.auth2.init({
client_id: '申请得到的客户端ID', //客户端ID
cookiepolicy: 'single_host_origin',
scope: 'profile' //可以请求除了默认的'profile' and 'email'之外的数据
});
attachSignin(document.getElementById('google_button')); //点击google登录的按钮
});

}

function attachSignin(element) {
auth2.attachClickHandler(element, {},
function(googleUser) {
var profile = auth2.currentUser.get().getBasicProfile();
console.log('ID: ' + profile.getId());
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());
}, function(error) {
console.log(JSON.stringify(error, undefined, 2));
});
}

web网站接入谷歌登录