正好前几天有小伙伴问我,那就记录一下吧。

什么是 OAuth2

这个解释的太多了,参考 理解OAuth 2.0,就不再赘述了。

实战一下

其实有很多种模式,这里直接用最简单的方式 (1次跳转 + 2次请求),用 GitHub 示例。

申请 OAuth2 应用

点击这里 申请,按照提示填好。把 Client IDClient secrets 记录一下,后续需要。

拼接授权的链接

GitHub 官方文档

拼接完成大概是一个这样的链接:

1
2
3
4
5
6
7
8
9
10
GET https://github.com/login/oauth/authorize?
client_id=xxx&
redirect_uri=xxx&
scope=xxx&
state=xxx

#client_id 上方记录的 Client ID
#redirect_uri 你填的回调地址,需要 url编码 一下
#scope 申请的权限,如果只是绑定,不是很建议申请太多
#state 防重放,可以md5一下时间戳

前端 重定向到这个链接,让用户授权。

code 换取 accessToken

上一步用户授权允许以后,会把 code 回调给你填写的回调地址,比如我的回调地址是 http://localhost/oauth2/github/callback

后端 发送以下请求:

1
2
3
4
5
6
7
POST https://github.com/login/oauth/access_token
client_id=xxx&client_secret=xxx&code=xxx&redirect_uri=xxx

#client_id 上方记录的 Client ID
#client_secret 上方记录的 Client secrets
#code callback url 里的参数
#redirect_uri 你填的回调地址,需要 url编码 一下

如果需要返回的格式为 json,user-agent 需要带上 Accept: application/json

accessToken 获取用户信息

上一步拿到 accessToken 以后,就可以获取用户信息了。

后端 发送以下请求:

1
GET https://api.github.com/user

user-agent 需要带上 Authorization: Bearer xxxxxx 是上方的 accessToken,中间有个空格。

然后就能拿到用户信息了。到这里,算是接入成功了,剩下的就是自己的一些业务逻辑了。

OAuth2 整理

我站接了 10 几个,所以顺带整理了一下,前往体验

平台 开发文档 申请地址 注意事项
爱发电 开发文档 私信站长 告知站长申请 OAuth2
百度 开发文档 网页创建 创建以后无法删除,刷新不了验证码
coding 开发文档 网页创建 jmglsi 改成自己的团队
discord 开发文档 网页创建
gitee 开发文档 网页创建
github 开发文档 网页创建
google 开发文档 网页创建
microsoft 开发文档 网页创建 创建的时候必须选择 任何组织目录,否则其他人没法授权
qq 开发文档 网页创建
telegram 开发文档 网页创建 返回到 /#/ 锚点,得特殊处理下
twitter 开发文档 网页创建 最傻b的,下面会说
weibo 开发文档 网页创建
yuque 开发文档 网页创建

注意事项

因为一些懂都懂的原因,后端访问国外的 OAuth2 体验并不佳 (除非服务器在国外),可能需要服务器上挂一个代理。

twitter 的第一步

跳转到授权页面

跳转链接后面需要加上 &code_challenge=challenge&code_challenge_method=plain 否则必定错误。

twitter 的第二步

获取 accessToken

POST内容需要加上 &code_verifier=challenge,user-agent 需要加上 Authorization: Basic xxxxxx 需要 base64_encode("{$client_id}:{$client_secret}") 否则必定报错。