JWT 簡介
什么是 JWT
全稱 JSON Web Token， 是目前最流行的跨域認證解決方案。基本的實現(xiàn)是服務(wù)端認證后，生成一個 JSON 對象，發(fā)回給用戶。用戶與服務(wù)端通信的時候，都要發(fā)回這個 JSON 對象。
該 JSON 類似如下：
{
"姓名": "張三",
"角色": "管理員",
"到期時間": "2018年7月1日0點0分"
}
為什么需要 JWT
先看下一般的認證流程，基于 session_id 和 Cookie 實現(xiàn)
- 用戶向服務(wù)器發(fā)送用戶名和密碼。
- 服務(wù)器驗證通過后，在當前對話（
session）里面保存相關(guān)數(shù)據(jù)，比如用戶角色、登錄時間等等。 - 服務(wù)器向用戶返回一個
session_id，寫入用戶的Cookie。 - 用戶隨后的每一次請求，都會通過
Cookie，將session_id傳回服務(wù)器。 - 服務(wù)器收到
session_id，找到前期保存的數(shù)據(jù)，由此得知用戶的身份。
但是這里有一個大的問題，假如是服務(wù)器集群，則要求 session 數(shù)據(jù)共享，每臺服務(wù)器都能夠讀取 session。這個實現(xiàn)成本是比較大的。
而 JWT 轉(zhuǎn)換了思路，將 JSON 數(shù)據(jù)返回給前端的，前端再次請求時候?qū)?shù)據(jù)發(fā)送到后端，后端進行驗證。也就是服務(wù)器是無狀態(tài)的，所以更加容易拓展。
JWT 的數(shù)據(jù)結(jié)構(gòu)
JWT 的三個部分依次如下:
-
Header（頭部），類似如下
{
"alg": "HS256",
"typ": "JWT"
}
alg 屬性表示簽名的算法（algorithm），默認是 HMAC SHA256（寫成 HS256）。typ 屬性表示這個令牌（token）的類型（type），JWT 令牌統(tǒng)一寫為 JWT
Payload（負載）。也是一個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)：編號
當然也可以自定義私有字段。但是要注意，JWT 默認是不加密的，任何人都可以讀到，所以不要把秘密信息放在這個部分。
-
Signature（簽名）。Signature部分是對前兩部分的簽名，防止數(shù)據(jù)篡改。首先，需要指定一個密鑰（secret）。這個密鑰只有服務(wù)器才知道，不能泄露給用戶。然后，使用Header里面指定的簽名算法（默認是HMAC SHA256），按照下面的公式產(chǎn)生簽名。
HMACSHA256(
base64UrlEncode(header) + "." +
base64UrlEncode(payload),
secret)
算出簽名以后，把 Header、Payload、Signature 三個部分拼成一個字符串，每個部分之間用"點"（.）分隔，就可以返回給用戶。如下所示
JWT 的安全
JWT默認是不加密，但也是可以加密的。JWT不加密的情況下，不能將秘密數(shù)據(jù)寫入JWTJWT本身包含了認證信息，一旦泄露，任何人都可以獲得該令牌的所有權(quán)限。為了減少盜用，JWT的有效期應該設(shè)置得比較短。對于一些比較重要的權(quán)限，使用時應該再次對用戶進行認證為了減少盜用，
JWT不應該使用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進一步的封裝，主要用來校驗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 存儲用戶的信息，真實應該是存放在數(shù)據(jù)庫中的。
const crypto = require("crypto"),
jwt = require("jsonwebtoken");
// TODO:使用數(shù)據(jù)庫
// 這里應該是用數(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（負載），用于編碼后存儲在 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ù)器進行驗證。這里如果之前放在 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 中間件進行驗證，方式比較簡單，如下所示
// 錯誤處理
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())
需要注意的是以下幾點：
-
secret必須和sign時候保持一致 - 可以通過
unless配置接口白名單，也就是哪些URL可以不用經(jīng)過校驗，像登陸/注冊都可以不用校驗 - 校驗的中間件需要放在需要校驗的路由前面，無法對前面的
URL進行校驗
演示
- 如果直接訪問需要登錄的接口，則會
401
- 先注冊，后登錄，不然會提示用戶名或者密碼錯誤
- 登錄后帶上
Authorization，可以正常訪問，返回200以及正確的數(shù)據(jù)
總結(jié)
本文總結(jié)了關(guān)于 JWT 鑒權(quán)相關(guān)的知識，并提供了一個 koa2 實現(xiàn)的簡單 demo，希望對大家有所幫助。
受制于篇幅，有機會單獨說下 koa-jwt 的源碼，也相對比較簡單~
