第六章中我們留下了一個(gè)問題,就是登錄成功后沒有跳轉(zhuǎn);其實(shí)了,就是攔截器上面的問題,今天我們就來解決這個(gè)問題?。。?/p>
仔細(xì)閱讀過官方文檔的朋友一定會發(fā)現(xiàn)在接口和模擬數(shù)據(jù)這一節(jié)介紹了攔截器,現(xiàn)在我們要做的就是將官方的代碼修改一下,改成能夠適配我們后端的代碼。
后端代碼是通過heades里面Authorization來存放token值的,所有我們需要再請求頭里面加上這個(gè)字段,代碼很簡單:
響應(yīng)攔截器解析的內(nèi)容需要適配后端的模型,官方的代碼是部分適配的,我們還需要自己修改一下;
axios.interceptors.response.use(
(response: AxiosResponse) =>{const res = response.data;
// 0成功,1失敗
// 全局統(tǒng)一攔截展示失敗原因,不用每個(gè)請求單獨(dú)寫
if (res.code !== 1) { Message.error({content: res.msg || '不明原因的錯誤',
duration: 5 * 1000,
});
return Promise.reject(new Error(res.msg || 'Error'));
}
return res.data;
},
(error) =>{Message.error({ content: error.msg || 'Request Error',
duration: 5 * 1000,
});
return Promise.reject(error);
}
);
這樣就可以按照我們自己的流程來處理了,有其他流程的可以自行添加!
前面我們修改了響應(yīng)攔截,最終返回的對象是data,所以在我們接口中也要進(jìn)行修改,因?yàn)楣俜侥J(rèn)返回的是response,data在response的下一層。
對象模型:
response:{
data:any,
code:number,
msg:string
}
所以在用到登錄接口的地方需要進(jìn)行修改
編譯重新運(yùn)行代碼,點(diǎn)擊登錄:
出現(xiàn)這些錯誤我們暫時(shí)忽略,注釋掉相關(guān)的接口代碼。
重新登錄,發(fā)現(xiàn)可以正常跳轉(zhuǎn)!
這個(gè)就很簡單了,只需要替換成我們自己的url地址,然后將字段模型一一對應(yīng)上就可以了,這里我就不再詳細(xì)介紹了,空了讀代碼就可以了解!
當(dāng)前版本tag:1.0.6
代碼倉庫
后臺數(shù)據(jù)庫只給了部分權(quán)限,報(bào)錯屬于正常!
想學(xué)的老鐵給點(diǎn)點(diǎn)關(guān)注吧?。?!
我是阿咕嚕,一個(gè)從互聯(lián)網(wǎng)慢慢上岸的程序員,如果喜歡我的文章,記得幫忙點(diǎn)個(gè)贊喲,謝謝!
你是否還在尋找穩(wěn)定的海外服務(wù)器提供商?創(chuàng)新互聯(lián)www.cdcxhl.cn海外機(jī)房具備T級流量清洗系統(tǒng)配攻擊溯源,準(zhǔn)確流量調(diào)度確保服務(wù)器高可用性,企業(yè)級服務(wù)器適合批量采購,新人活動首月15元起,快前往官網(wǎng)查看詳情吧
本文標(biāo)題:從零開始,手打一個(gè)權(quán)限管理系統(tǒng)(第七章前端攔截器)-創(chuàng)新互聯(lián)
文章地址:http://aaarwkj.com/article4/gjooe.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供手機(jī)網(wǎng)站建設(shè)、外貿(mào)建站、網(wǎng)站設(shè)計(jì)公司、網(wǎng)站改版、App設(shè)計(jì)、品牌網(wǎng)站制作
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來源: 創(chuàng)新互聯(lián)
猜你還喜歡下面的內(nèi)容