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 [email protected]: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 数据,里面包含了令牌accessTokenconst 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}`);

总结:


![AB.png](https://upload-images.jianshu.io/upload_images/4762081-052eeb1c4cd52dde.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)

相关文档

  • 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

你可能感兴趣的:(Oauth 2.0 学习笔记)