实现 Google 第三方授权登录
最近做项目要实现Google的第三方登录,这简单的记录一下。
目前Google的第三方登录有很多方案,且官方提供SDK方便接入。但是我这个项目同时要实现网页和客户端。所以选择了 Google OAuth 2.0 的方案。
当然,也可以 《实现 Facebook 第三方授权登录》
Google 的 OAuth 2.0 流程
配置 Google Cloud Platform
首先访问 Google Cloud Platform 控制台
地址:https://console.cloud.google.com/projectselector2/home
开始创建 Google Cloud Platform 项目
OAuth 同意屏幕
在左边的侧边栏中选择API和服务
进入API和服务页面
注意:测试账户只能添加不能删除且限制100个
设置 OAuth 同意屏幕流程(建议查看大图)
网域验证
设置网域验证
配置完成的样式
凭据
客户端ID用户用户登录,密钥用于服务器验证Token是否有效以及获取用户信息
设置凭据
获取登录地址
大致的流程
Google的文档其实写的很清楚了:传送门
生成临时的用户ID主要是为了识别触发OAuth登录的用户。这里最好还是后端服务器生成。
主要说的是如何生成Google的登录链接,下面是一个生成好的登录链接。
https://accounts.google.com/o/oauth2/v2/auth?scope=https://www.googleapis.com/auth/userinfo.email&include_granted_scopes=true&response_type=token&state=3EAB37D9D5310BFE&redirect_uri=https://www.idzd.top/oauth&client_id=858244192640-2t7giod7t0rmbc36tel1fl50ppqn7s8e.apps.googleusercontent.com一个生成好的登录链接
参数说明scope (必须)需要用户给予的权限,这里只要了用户的邮箱include_granted_scopes增量授权,即获得用户以前给予的所有权限response_type (必须)返回的授权码类型,这里用的tokenstate用来维护授权请求和授权服务器的响应之间的状态的任何字符串值redirect_uri (必须)确定用户完成授权流程后API服务器将用户重定向到的位置client_id (必须)应用程序的客户端ID验证Token
好的,我们已经成功登录了,现在得到了一个回调地址
https://www.xxx.top/404#state=3EAB37D9D5310BFE&access_token=ya29.a0AfH6SMB3rFcyq-d8NW3IlCriJvdpPY9Qy29TtMSnuwZ9wVXgGpfDCNBqZvnoKrrcDipoP9A234KtdKpDdXbyzOVp_1PbLbyIMjO5Hx5c_vm0A9PWDTIfXfmwVsugPlUp8VcRCNHnsXVwds2GT&token_type=Bearer&expires_in=3598&scope=email%20openid%20https://www.googleapis.com/auth/userinfo.email&authuser=0&prompt=none回调地址
其中 access_token 和 state 是关键,
为了严谨,前台会比对 state 的值和生成登录地址时返回的值是否一致,来验证会话的一致性。但是一般前台页面很难安全的保存这个信息。
好的,现在把 access_token 和 state 发回给后端,让他验证token是否有效吧~
后端GET这个地址,获取用户的邮箱:
https://www.googleapis.com/oauth2/v2/userinfo?access_token=ya29.a0AfH6SMB3rFcyq-d8NW3IlCriJvdpPCNBqZvnoKrrcDipoP9A234KtdKpDdXbyzOVp_1PbLbyIMjO5Hx5c_vm0A9PWDTIfXfmwVsugPlUp8VcRCNHnsXVwds2GT通过令牌可以获取用户的信息,比如邮箱,昵称,头像等等
{"id":"XXXXXXXXXXXXXXXXX","email":"xxxx1921295@qq.com","verified_email":true,"picture":"https://lh3.googleusercontent.com/a-/AOh14GjW7-O4rqIeKtGB_rorN6KIDYd6fRzaEaPYPoKV=s96-c"}JSON
OK,到这步,就直接根据邮箱和id,来建立对应的账号关系就可以了~