Web网站实现Google登录
一、打开谷歌控制台:https://console.developers.google.com/apis
二、点击创建凭据,如下图,填写项目地址等

三、创建好客户端ID和秘钥后,填写对应的项目网址和登录页网址

四、修改OAuth同意屏幕网站首页地址和隐私政策网址

五、代码部分如下:
<script src="https://apis.google.com/js/api:client.js"></script>function google_login() {
var googleUser = {};
gapi.load('auth2', function(){
// Retrieve the singleton for the GoogleAuth 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网站实现Google登录的更多相关文章
- 钉钉授权第三方WEB网站扫码登录
一.阅读开发文档 首先阅读钉钉官方的开发文档,扫码登录其实用的是官方文档描述的第二种方式,即将钉钉登录二维码内嵌到自己页面中,用户使用钉钉扫码登录第三方网站,网站可以拿到钉钉的用户信息. 二.准备工作 ...
- Web网站实现facebook登录
一.登录facebook开发者中心:https://developers.facebook.com 二.创建应用编号,如下图: 三.添加产品选择Facebook登录,如下图: 四.facebbok登录 ...
- (钉钉)第三方WEB网站扫码登录
年底在做钉钉和公司的知识库产品的对接,怎么使用钉钉api的如下: 第一步: 登录:https://oa.dingtalk.com/#/welcome 这点可以自己建立一个企业账号进行测试 点击工作台建 ...
- NodeJS学习笔记(一)——搭建开发框架Express,实现Web网站登录验证
JS是脚本语言,脚本语言都需要一个解析器才能运行.对于写在HTML页面里的JS,浏览器充当了解析器的角色.而对于需要独立运行的JS,NodeJS就是一个解析器.每一种解析器都是一个运行环境,不但允许J ...
- 搭建开发框架Express,实现Web网站登录验证
NodeJS学习笔记(一)——搭建开发框架Express,实现Web网站登录验证 JS是脚本语言,脚本语言都需要一个解析器才能运行.对于写在HTML页面里的JS,浏览器充当了解析器的角色.而对于需 ...
- JWT(JSON Web Token) 多网站的单点登录,放弃session
多个网站之间的登录信息共享, 一种解决方案是基于cookie - session的登录认证方式,这种方式跨域比较复杂. 另一种替代方案是采用基于算法的认证方式, JWT(json web token) ...
- JWT(JSON Web Token) 多网站的单点登录,放弃session 转载https://www.cnblogs.com/lexiaofei/p/7409846.html
多个网站之间的登录信息共享, 一种解决方案是基于cookie - session的登录认证方式,这种方式跨域比较复杂. 另一种替代方案是采用基于算法的认证方式, JWT(json web token) ...
- 【架构】浅谈web网站架构演变过程
浅谈web网站架构演变过程 前言 我们以javaweb为例,来搭建一个简单的电商系统,看看这个系统可以如何一步步演变. 该系统具备的功能: 用户模块:用户注册和管理 商品模块:商品展示和管 ...
- (转)web网站架构演变
浅谈web网站架构演变过程 前言 我们以javaweb为例,来搭建一个简单的电商系统,看看这个系统可以如何一步步演变. 该系统具备的功能: 用户模块:用户注册和管理 商品模块:商品展示和管 ...
随机推荐
- mysql关键字冲突
在冲突的字段加上转移符,这样子就可以了: insert into test_table (wind_code,name,`read`,creade_time) values (?,?,?,?) (注意 ...
- 从ASP.NET到ASP.NET Core差异变化
MSDN原文:链接 ASP.NET Core项目为开发人员提供了针对.NET Core,.NET Framework2种实现方式,根据官网通告NETCORE3.0后将取消对.NET Framework ...
- pytesseract.pytesseract.TesseractNotFoundError: tesseract is not installed or it's not in your path
使用pytesseract识别验证码中遇到异常如下: pytesseract.pytesseract.TesseractNotFoundError: tesseract is not installe ...
- 【SpringBoot】SpringBoot日志框架(四)
日志框架介绍 在开发过程中,我们经常使用到日志来进行排查问题,我们使用的日志框架都是由2部分组成(日志API + 日志实现) 日志API(及日志抽象层)有:SLF4j(Simple Logging F ...
- JavaScript 有用的代码片段和 trick
浮点数取整 const x = 123.4545; x >> 0; // 123 ~~x; // 123 x | 0; // 123 Math.floor(x); // 123 注意:前三 ...
- 1-1docker加速器
配置加速器 #编译配置 sudo vim /etc/docker/daemon.json #加入下面的数据 { "registry-mirrors": ["https:/ ...
- ThinkPHP3(命名空间、RBAC)
命名空间 当开发大型项目的时候,可以会需要成千上万的文件 面向对象通过命名空间来解决这个问题的. PHP命名空间是PHP5.3以后才出现的. 命名空间中可以出现:类,函数,常量 只有const定义的常 ...
- 修改 Delphi 10.3.3 IDE 字体和字体大小
Delphi 10.2.2 之前,可以通过 IDE视觉设置的系统注册表项 修改字体和字体大小,因为 Delphi 10.2.2 IDE增加了主题,主题包含了字体信息, 此方法失效了.对于高分辨率屏幕, ...
- python学习-30 总结
小结 1.map函数: 处理序列中的每个元素,得到结果是一个‘列表’,该‘列表’元素个数及位置与原来一样 2.filter:遍历序列中的每个元素,判断每个元素得到的布尔值,如果是True则留下来,例如 ...
- Django框架(十)--ORM多对多关联关系三种创建方式、form组件
多对多的三种创建方式 1.全自动(就是平常我们创建表多对多关系的方式) class Book(models.Model): title = models.CharField(max_length=32 ...