,,

實(shí)現(xiàn)無感刷新Token技術(shù)：.Net Web API與axios的完美結(jié)合

當(dāng)前位置：點(diǎn)晴教程→知識(shí)管理交流 →『技術(shù)文檔交流』

admin

2024年2月7日 22:0 本文熱度 1044

我們都知道Token是有設(shè)置有效期的，為了安全都不會(huì)設(shè)置過長(zhǎng)的有效期；但設(shè)置有效期太短，又會(huì)導(dǎo)致經(jīng)常需要重新登錄。

這就需要無感刷新Token的方案，來提升用戶體驗(yàn)。

目前比較常用的方案是：雙token機(jī)制。

1、登錄時(shí)同時(shí)返回：Token、RefreshToken，Token用于請(qǐng)求業(yè)務(wù)接口，RefreshToken用于刷新Token接口；

2、每一次Http請(qǐng)求，客戶端都會(huì)判斷服務(wù)器返回狀態(tài)，如果是401，代表Token過期；

3、客戶端使用RefreshToken，請(qǐng)求服務(wù)器Token刷新接口，并獲取新的：Token，RefreshToken；

4、如果第3步驟成功返回，更新本地的Token、RefreshToken；如果返回失敗，代表RefreshToken也過期了，提示過期并跳轉(zhuǎn)至登錄頁面。

下面我們一起看下實(shí)現(xiàn)步驟：

1、后臺(tái)登錄接口

登錄驗(yàn)證，驗(yàn)證用戶名和密碼，驗(yàn)證通過返回Token。

登錄接口返回的2個(gè)內(nèi)容：Token和RefreshToken，這兩個(gè)有效期不一樣，比如Token有效期是30分鐘，RefreshToken有效期是60分鐘。

2、后臺(tái)刷新token接口

和登錄接口一樣，也是返回：Token和RefreshToken。

3、前端登錄功能

在前端登錄頁面，成功登錄后，把Token和RefreshToken存儲(chǔ)在本地，可以存儲(chǔ)在Cookie或者LocalStorage。

4、錯(cuò)誤響應(yīng)攔截器

axios響應(yīng)攔截器添加如下代碼：

a、判斷Http返回狀態(tài)是否為401。

b、判斷是否授權(quán)信息是否使用refreshToken，調(diào)用刷新token接口，同樣也會(huì)發(fā)起Http請(qǐng)求，如果refreshToken也過期了，同樣會(huì)返回401;所以這邊要加判斷，避免進(jìn)入死循環(huán)。

c、如果refreshToken也過期了，直接跳轉(zhuǎn)至登錄頁面。

d、如果調(diào)用刷新token接口成功返回，更新本地存儲(chǔ)的Token、RefreshToken；并獲取上一次業(yè)務(wù)請(qǐng)求的內(nèi)容，并更新驗(yàn)證信息，重新發(fā)起上一次業(yè)務(wù)請(qǐng)求，這樣才能實(shí)現(xiàn)無感刷新。