Oauth 2.0 学习笔记

定义

• OAuth是一个关于授权（authorization）的开放网络标准，在全世界得到广泛应用，目前的版本是2.0版
  举例： OAuth 就是一种授权机制。数据的所有者告诉系统，同意授权第三方应用进入系统，获取这些数据。系统从而产生一个短期的进入令牌（token），用来代替密码，供第三方应用使用。
• 令牌（token）与密码（password）
  相同点
  作用是一样的，都可以进入系统，但是有三点差异
  不同点
  （1）令牌是短期的，到期会自动失效，用户自己无法修改。密码一般长期有效，用户不修改，就不会发生变化。
  （2）令牌可以被数据所有者撤销，会立即失效。以上例而言，屋主可以随时取消快递员的令牌。密码一般不允许被他人撤销。
  （3）令牌有权限范围（scope），比如只能进小区的二号门。对于网络服务来说，只读令牌就比读写令牌更安全。密码一般是完整权限。
• 令牌使用
  A 网站拿到令牌以后，就可以向 B 网站的 API 请求数据了
  每个发到 API 的请求，都必须带有令牌
  具体做法是在请求的头信息，加上一个Authorization字段，令牌就放在这个字段里面。

  curl -H "Authorization: Bearer ACCESS_TOKEN" \"[https://api.b.com](https://api.b.com/)"

上面命令中，ACCESS_TOKEN就是拿到的令牌。

• 令牌更新
  令牌的有效期到了
  具体方法是，B 网站颁发令牌的时候，一次性颁发两个令牌，一个用于获取数据，另一个用于获取新的令牌（refresh token 字段）。令牌到期前，用户使用 refresh token 发一个请求，去更新令牌。B 网站验证通过以后，就会颁发新的令牌。
  https://b.com/oauth/token?grant_type=refresh_token&client_id=CLIENT_ID&client_secret=CLIENT_SECRET&refresh_token=REFRESH_TOKEN
  上面 URL 中，grant_type参数为refresh_token表示要求更新令牌，client_id参数和client_secret参数用于确认身份，refresh_token参数就是用于更新令牌的令牌。

4种授权方式

4种授权类型.png

举例：授权码

AB.png

第一步，A 网站提供一个链接，用户点击后就会跳转到 B 网站，授权用户数据给 A 网站使用。下面就是 A 网站跳转 B 网站的一个示意链接。

https://b.com/oauth/authorize?
  response_type=code&
  client_id=CLIENT_ID&
  redirect_uri=CALLBACK_URL&
  scope=read

上面 URL 中，response_type参数表示要求返回授权码（code），client_id参数让 B 知道是谁在请求，redirect_uri参数是 B 接受或拒绝请求后的跳转网址，scope参数表示要求的授权范围（这里是只读）。

第二步，用户跳转后，B 网站会要求用户登录，然后询问是否同意给予 A 网站授权。用户表示同意，这时 B 网站就会跳回redirect_uri参数指定的网址。跳转时，会传回一个授权码，就像下面这样

https://a.com/callback?code=AUTHORIZATION_CODE

上面 URL 中，code参数就是授权码。

第三步，A 网站拿到授权码以后，就可以在后端，向 B 网站请求令牌。

https://b.com/oauth/token?
 client_id=CLIENT_ID&
 client_secret=CLIENT_SECRET&
 grant_type=authorization_code&
 code=AUTHORIZATION_CODE&
 redirect_uri=CALLBACK_URL

上面 URL 中，client_id参数和client_secret参数用来让 B 确认 A 的身份（client_secret参数是保密的，因此只能在后端发请求），grant_type参数的值是AUTHORIZATION_CODE，表示采用的授权方式是授权码，code参数是上一步拿到的授权码，redirect_uri参数是令牌颁发后的回调网址。

第四步，B 网站收到请求以后，就会颁发令牌。具体做法是向redirect_uri指定的网址，发送一段 JSON 数据。

{    
  "access_token":"ACCESS_TOKEN",
  "token_type":"bearer",
  "expires_in":2592000,
  "refresh_token":"REFRESH_TOKEN",
  "scope":"read",
  "uid":100101,
  "info":{...}
}

上面 JSON 数据中，access_token字段就是令牌，A 网站在后端拿到了。

Demo

---

下载源码

源码github链接: 网上提供的代码仓库，请将它克隆到本地。

$ git clone git@github.com:ruanyf/node-oauth-demo.git
$ cd node-oauth-demo

两个配置项要改一下，写入上一步的身份识别码。

• index.js：改掉变量clientID and clientSecret
• public/index.html：改掉变量client_id

然后，安装依赖。

$ npm install

启动服务。

$ node index.js

浏览器访问[http://localhost:8080](http://localhost:8080/)，就可以看到这个示例了。

login.jpeg

---

查看授权页面

示例的首页很简单，就是一个链接，让用户跳转到 GitHub。

authorization.png

跳转的 URL 如下。

https://github.com/login/oauth/authorize?
  client_id=7e015d8ce32370079895&
  redirect_uri=http://localhost:8080/oauth/redirect

这个 URL 指向 GitHub 的 OAuth 授权网址，带有两个参数：client_id告诉 GitHub 谁在请求，redirect_uri是稍后跳转回来的网址。
用户点击到了 GitHub，GitHub 会要求用户登录，确保是本人在操作。
登录后，GitHub 询问用户，该应用正在请求数据，你是否同意授权。
[图片上传中...(code.png-7e7999-1645355031998-0)]

用户同意授权， GitHub 就会跳转到redirect_uri指定的跳转网址，并且带上授权码，跳转回来的 URL 就是下面的样子。

http://localhost:8080/oauth/redirect?code=859310e7cecc9196f4af

后端收到这个请求以后，就拿到了授权码（code参数）。

后端实现

示例的后端采用 Koa 框架编写，具体语法请看教程。
这里的关键是针对/oauth/redirect的请求，编写一个路由，完成 OAuth 认证。

const oauth = async ctx => {
  // ...
};

app.use(route.get('/oauth/redirect', oauth));

上面代码中，oauth函数就是路由的处理函数。下面的代码都写在这个函数里面。

路由函数的第一件事，是从 URL 取出授权码。

const requestToken = ctx.request.query.code;

后端使用这个授权码，向 GitHub 请求令牌。

const tokenResponse = await axios({
  method: 'post',
  url: 'https://github.com/login/oauth/access_token?' +
    `client_id=${clientID}&` +
    `client_secret=${clientSecret}&` +
    `code=${requestToken}`,
  headers: {
    accept: 'application/json'
  }
});

上面代码中，GitHub 的令牌接口[https://github.com/login/oauth/access_token](https://github.com/login/oauth/access_token)需要提供三个参数。

• client_id：客户端的 ID
• client_secret：客户端的密钥
• code：授权码
  作为回应，GitHub 会返回一段 JSON 数据，里面包含了令牌accessToken。const accessToken = tokenResponse.data.access_token；

API数据

有了令牌以后，就可以向 API 请求数据了。

const result = await axios({
  method: 'get',
  url: `https://api.github.com/user`,
  headers: {
    accept: 'application/json',
    Authorization: `token ${accessToken}`
  }
});

上面代码中，GitHub API 的地址是[https://api.github.com/user](https://api.github.com/user)，请求的时候必须在 HTTP 头信息里面带上令牌Authorization: token 361507da。

然后，就可以拿到用户数据，得到用户的身份。

const name = result.data.name;
ctx.response.redirect(`/welcome.html?name=${name}`);

总结：


相关文档

• https://www.ruanyifeng.com/blog/2014/05/oauth_2_0.html
• https://www.ruanyifeng.com/blog/2019/04/oauth_design.html
• https://www.ruanyifeng.com/blog/2019/04/oauth-grant-types.html
• https://www.ruanyifeng.com/blog/2019/04/github-oauth.html