隨著互聯網的崛起，對Web服務應用的安全性要求越來越高。在前后端分離的開發模式中，服務端使用特定的加密方式生成token，客戶端儲存token作為授權傳遞給服務端，驗證身份等信息是保障安全性的一種方式。其中JWT（JSON Web Token）這種用于通信雙方之間以 JSON 對象的形式傳遞信息的輕量鑒權方式受到越來越多的開發者喜愛。

什么是鑒權

如果沒有鑒權信息,他人能夠輕而易舉的調用API對我們的數據進行操作。下圖是一種常見的鑒權流程。客戶端輸入用戶名密碼等身份信息，服務端生成一個token（token可以是user唯一能識別身份的非敏感信息通過鑒權的加密方式生成），然后再將token 返回給瀏覽器客戶端，再次訪問服務器時帶上token信息，服務器會使用同樣的鑒權方式對token進行驗證，token驗證一致后執行具體操作。

image

應用

我需要一下將json信息使用jwt鑒權方式生成token。

{
  "name": "scar",
  "role": "admin",
  "expirationData": "2018-10-24 17:05:00"
}

JWT鑒權

JWT由三部分組成。

1.頭部Header

json格式，指定了加密算法(alg)和token類型(typ)。

2.有效信息payload

json格式，標準中的注冊可選參數以及需要傳輸的待加密信息，官方提供了可選參數如下表。

payload官方可選參數

3.簽名signature

由Header和Payload經過處理得到，防止信息被篡改。

將Header和Payload分別經過base64UrlEncode加密，得到before_sign = base64UrlEncode(Header).base64UrlEncode(Payload)，中間用英文句號連接，然后將before_sign作為加密函數的第一個傳參，Secret Salt（鹽）作為加密函數的第二個傳參，通過Header里面定義好的alg加密方式進行加密,最后用英文句號連接before_sign和加密后的before_sign。final_sign=before_sign+'.'+HS256(before_sign, secretSalt);

實現的代碼

首先引入加密庫CryptoJS 與jsrsasign，

//和普通base64加密不一樣
function base64UrlEncode(str) {
   var encodedSource = CryptoJS.enc.Base64.stringify(str);
   var reg = new RegExp('/', 'g');
   encodedSource = encodedSource.replace(/=+$/,'').replace(/\+/g,'-').replace(reg,'_');
   return encodedSource;
}

let header = JSON.stringify({
  "alg": "HS256",
  "typ": "JWT"
})

let payload =JSON.stringify({
  "name": "scar",
  "role": "admin",
  "expirationData": "2018-10-24 17:05:00"
});
let secretSalt = "user";

let before_sign = base64UrlEncode(CryptoJS.enc.Utf8.parse(header)) + '.' + base64UrlEncode(CryptoJS.enc.Utf8.parse(payload));

let  signature =CryptoJS.HmacSHA256(before_sign, secretSalt);
 signature = base64UrlEncode(signature);
 
let final_sign = before_sign + '.' + signature;
//final_sign:eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJuYW1lIjoic2NhciIsInJvbGUiOiJhZG1pbiIsImV4cGlyYXRpb25EYXRhIjoiMjAxOC0xMC0yNCAxNzowNTowMCJ9.bVc48JsxiM7ZZgtZch1QnRpLyt08M9LepwoLvs_aejI

圖片來自jwt.io

使用javascript實現有一定的加密算法限制，目前ES512（ECDSA with curve P-521 and SHA-512）是不被支持的。

使用eoLinker做驗證

填寫好響應的信息，此處我將jwt鑒權token放在請求頭部的Authorization中。

image

點擊測試后，得到和我們的加密函數一樣的結果

image