快捷導(dǎo)航

Node使用koa2實現(xiàn)一個簡單JWT鑒權(quán)的方法

更新時間：2021年01月26日 15:23:44 作者：Gopal

這篇文章主要介紹了Node使用koa2實現(xiàn)一個簡單JWT鑒權(quán)的方法，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧

JWT 簡介

什么是 JWT

全稱 JSON Web Token ，是目前最流行的跨域認(rèn)證解決方案?；镜膶崿F(xiàn)是服務(wù)端認(rèn)證后，生成一個 JSON 對象，發(fā)回給用戶。用戶與服務(wù)端通信的時候，都要發(fā)回這個 JSON 對象。

該 JSON 類似如下：

{
 "姓名": "張三",
 "角色": "管理員",
 "到期時間": "2018年7月1日0點0分"
}

為什么需要 JWT

先看下一般的認(rèn)證流程，基于 session_id 和 Cookie 實現(xiàn)

1、用戶向服務(wù)器發(fā)送用戶名和密碼。

2、服務(wù)器驗證通過后，在當(dāng)前對話（ session ）里面保存相關(guān)數(shù)據(jù)，比如用戶角色、登錄時間等等。

3、服務(wù)器向用戶返回一個 session_id ，寫入用戶的 Cookie 。

4、用戶隨后的每一次請求，都會通過 Cookie ，將 session_id 傳回服務(wù)器。

5、服務(wù)器收到 session_id ，找到前期保存的數(shù)據(jù)，由此得知用戶的身份。

但是這里有一個大的問題，假如是服務(wù)器集群，則要求 session 數(shù)據(jù)共享，每臺服務(wù)器都能夠讀取 session 。這個實現(xiàn)成本是比較大的。

而 JWT 轉(zhuǎn)換了思路，將 JSON 數(shù)據(jù)返回給前端的，前端再次請求時候?qū)?shù)據(jù)發(fā)送到后端，后端進(jìn)行驗證。也就是服務(wù)器是無狀態(tài)的，所以更加容易拓展。

JWT 的數(shù)據(jù)結(jié)構(gòu)

JWT 的三個部分依次如下:

Header （頭部），類似如下

{
 "alg": "HS256",
 "typ": "JWT"
}

alg 屬性表示簽名的算法（ algorithm ），默認(rèn)是 HMAC SHA256 （寫成 HS256 ）。 typ 屬性表示這個令牌（ token ）的類型（ type ）， JWT 令牌統(tǒng)一寫為 JWT

Payload （負(fù)載）。也是一個 JSON ，用來存放實際需要傳遞的數(shù)據(jù)。 JWT 規(guī)定了 7 個官方字段。如下所示

iss (issuer)：簽發(fā)人
exp (expiration time)：過期時間
sub (subject)：主題
aud (audience)：受眾
nbf (Not Before)：生效時間
iat (Issued At)：簽發(fā)時間
jti (JWT ID)：編號

當(dāng)然也可以自定義私有字段。但是要注意，JWT 默認(rèn)是不加密的，任何人都可以讀到，所以不要把秘密信息放在這個部分。

Signature （簽名）。 Signature 部分是對前兩部分的簽名，防止數(shù)據(jù)篡改。首先，需要指定一個密鑰（ secret ）。這個密鑰只有服務(wù)器才知道，不能泄露給用戶。然后，使用 Header 里面指定的簽名算法（默認(rèn)是 HMAC SHA256 ），按照下面的公式產(chǎn)生簽名。

HMACSHA256(
 base64UrlEncode(header) + "." +
 base64UrlEncode(payload),
 secret)

算出簽名以后，把 Header 、 Payload 、 Signature 三個部分拼成一個字符串，每個部分之間用"點"（.）分隔，就可以返回給用戶。如下所示

JWT 的安全

JWT 默認(rèn)是不加密，但也是可以加密的。 JWT 不加密的情況下，不能將秘密數(shù)據(jù)寫入 JWT
JWT 本身包含了認(rèn)證信息，一旦泄露，任何人都可以獲得該令牌的所有權(quán)限。為了減少盜用， JWT 的有效期應(yīng)該設(shè)置得比較短。對于一些比較重要的權(quán)限，使用時應(yīng)該再次對用戶進(jìn)行認(rèn)證
為了減少盜用， JWT 不應(yīng)該使用 HTTP 協(xié)議明碼傳輸，要使用 HTTPS 協(xié)議傳輸

Node 簡單demo—— Koa JWT 的實現(xiàn)

說完理論知識，我們來看下如何實現(xiàn) JWT ，大致的流程如下：

首先，用戶登錄后服務(wù)端根據(jù)用戶信息生成并返回 token 給到客戶端，前端在下次請求中把 token 帶給服務(wù)器，服務(wù)器驗證有效后，返回數(shù)據(jù)。無效的話，返回 401 狀態(tài)碼

這里我們用 Node 實現(xiàn)，主要用到的兩個庫有

jsonwebtoken ，可以生成 token ，校驗等

koa-jwt 中間件對 jsonwebtoken 進(jìn)一步的封裝，主要用來校驗 token

快速搭建一個 koa 項目

發(fā)現(xiàn)官方目前沒有一個快速搭建 koa 項目的方式，像 Vue-cli 一樣。（可能是搭建一個 koa 項目成本也很低）。但懶人的我，還是找到了一個工具 ——koa-generator ，使用也相對簡單，如下

安裝

npm install -g koa-generator

koa2 my-project 新建一個叫做 my-project 的 koa2 項目

cd my-project 和 npm install

啟動項目 npm start

打開 localhost:3000

生成 Token

為了演示方便，我這里直接定義了變量 userList 存儲用戶的信息，真實應(yīng)該是存放在數(shù)據(jù)庫中的。

const crypto = require("crypto"),
 jwt = require("jsonwebtoken");
// TODO:使用數(shù)據(jù)庫
// 這里應(yīng)該是用數(shù)據(jù)庫存儲，這里只是演示用
let userList = [];

class UserController {
 // 用戶登錄
 static async login(ctx) {
  const data = ctx.request.body;
  if (!data.name || !data.password) {
   return ctx.body = {
    code: "000002", 
    message: "參數(shù)不合法"
   }
  }
  const result = userList.find(item => item.name === data.name && item.password === crypto.createHash('md5').update(data.password).digest('hex'))
  if (result) {
   const token = jwt.sign(
    {
     name: result.name
    },
    "Gopal_token", // secret
    { expiresIn: 60 * 60 } // 60 * 60 s
   );
   return ctx.body = {
    code: "0",
    message: "登錄成功",
    data: {
     token
    }
   };
  } else {
   return ctx.body = {
    code: "000002",
    message: "用戶名或密碼錯誤"
   };
  }
 }
}

module.exports = UserController;

通過 jsonwebtoken 的 sign 方法生成一個 token 。該方法第一個參數(shù)指的是 Payload （負(fù)載），用于編碼后存儲在 token 中的數(shù)據(jù)，也是校驗 token 后可以拿到的數(shù)據(jù)。第二個是秘鑰，服務(wù)端特有， 注意校驗的時候要相同才能解碼，而且是保密的 ，一般而言，最好是定公共的變量，這里只是演示方便，直接寫死。第三個參數(shù)是 option ，可以定義 token 過期時間

客戶端獲取 token

前端登錄獲取到 token 后可以存儲到 cookie 中也可以存放在 localStorage 中。這里我直接存到了 localStorage 中

login() {
 this.$axios
  .post("/api/login", {
   ...this.ruleForm,
  })
  .then(res => {
   if (res.code === "0") {
    this.$message.success('登錄成功');
    localStorage.setItem("token", res.data.token);
    this.$router.push("/");
   } else {
    this.$message(res.message);
   }
  });
}

封裝 axios 的攔截器，每次請求的時候把 token 帶在請求頭發(fā)送給服務(wù)器進(jìn)行驗證。這里如果之前放在 Cookie 中，可以讓它自動發(fā)送，但是這樣不能跨域。所以推薦做法是放在 HTTP 請求頭 Authorization 中，注意這里的 Authorization 的設(shè)置，前面要加上 Bearer 。詳情可以見 Bearer Authentication

// axios 請求攔截器處理請求數(shù)據(jù)
axios.interceptors.request.use(config => {
 const token = localStorage.getItem('token');
 config.headers.common['Authorization'] = 'Bearer ' + token; // 留意這里的 Authorization
 return config;
})

校驗 token

使用 koa-jwt 中間件進(jìn)行驗證，方式比較簡單，如下所示

// 錯誤處理
app.use((ctx, next) => {
 return next().catch((err) => {
   if(err.status === 401){
     ctx.status = 401;
    ctx.body = 'Protected resource, use Authorization header to get access\n';
   }else{
     throw err;
   }
 })
})

// 注意：放在路由前面
app.use(koajwt({
 secret: 'Gopal_token'
}).unless({ // 配置白名單
 path: [/\/api\/register/, /\/api\/login/]
}))

// routes
app.use(index.routes(), index.allowedMethods())
app.use(users.routes(), users.allowedMethods())

需要注意的是以下幾點：