vue路由攔截器和請(qǐng)求攔截器知識(shí)點(diǎn)總結(jié)
更新時(shí)間：2019年11月08日 14:31:02 作者：巫小詩(shī)
在本篇文章里小編給各位整理的是一篇關(guān)于vue路由攔截器和請(qǐng)求攔截器知識(shí)點(diǎn)總結(jié)文章，有興趣的朋友們學(xué)習(xí)下。
路由攔截器
已路由為導(dǎo)向
router.beforeEach((to,from,next)=>{
if(to.path=='/login' || localStorage.getItem('token')){
next();
}else{
alert('請(qǐng)重新登錄');
next('/login');
}
})
請(qǐng)求攔截器
當(dāng)發(fā)送請(qǐng)求時(shí)才會(huì)觸發(fā)此功能
axios.interceptors.request.use(function (config) {
let token = window.localStorage.getItem("token");
if (token) {
config.headers.token = token; //將token放到請(qǐng)求頭發(fā)送給服務(wù)器
}
return config; // 最終需要返回config
}, function (error) {
return Promise.reject(error);
});
知識(shí)點(diǎn)和代碼非常簡(jiǎn)單，更多知識(shí)點(diǎn)可以在下方相關(guān)文章找到，感謝大家對(duì)腳本之家的支持。
您可能感興趣的文章:
- vue3 onMounted異步函數(shù)同步請(qǐng)求async/await實(shí)現(xiàn)
- vue函數(shù)input輸入值請(qǐng)求時(shí)延遲1.5秒請(qǐng)求問(wèn)題
- Vue2的路由和異步請(qǐng)求方式
- Vue路由切換和Axios接口取消重復(fù)請(qǐng)求詳解
- vue路由切換時(shí)取消之前的所有請(qǐng)求操作
- vue路由導(dǎo)航守衛(wèi)和請(qǐng)求攔截以及基于node的token認(rèn)證的方法
- vue-resource請(qǐng)求實(shí)現(xiàn)http登錄攔截或者路由攔截的方法
- vue請(qǐng)求函數(shù)和路由的安裝使用過(guò)程
相關(guān)文章
使用Vue3進(jìn)行數(shù)據(jù)綁定及顯示列表數(shù)據(jù)
這篇文章主要介紹了使用Vue3進(jìn)行數(shù)據(jù)綁定及顯示列表數(shù)據(jù)，整篇文章圍繞Vue3進(jìn)行數(shù)據(jù)綁定及顯示列表數(shù)據(jù)的想換自來(lái)哦展開(kāi)內(nèi)容,需要的小伙伴可以參考一下2021-10-10
Vue ElementUi同時(shí)校驗(yàn)多個(gè)表單(巧用new promise)
這篇文章主要介紹了巧用new promise實(shí)現(xiàn)Vue ElementUi同時(shí)校驗(yàn)多個(gè)表單功能，實(shí)現(xiàn)的方法有很多種，本文給大家?guī)?lái)的是一種比較完美的方案,需要的朋友可以參考下2018-06-06
vue實(shí)現(xiàn)點(diǎn)擊關(guān)注后及時(shí)更新列表功能
這篇文章主要介紹了vue實(shí)現(xiàn)點(diǎn)擊關(guān)注后及時(shí)更新列表功能，本文通過(guò)實(shí)例代碼給大家介紹的非常詳細(xì),具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2018-06-06
Vue中props報(bào)錯(cuò)問(wèn)題解決方案
這篇文章主要介紹了Vue中props報(bào)錯(cuò)問(wèn)題解決方案,本文給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2023-09-09
這篇文章主要為大家詳細(xì)介紹了vue實(shí)現(xiàn)批量下載文件的方法（不走后端接口的方法）,文中的示例代碼講解詳細(xì),感興趣的小伙伴可以跟隨小編一起學(xué)習(xí)一下2023-12-12
開(kāi)發(fā)中我們?cè)赿ata返回的對(duì)象中定義了數(shù)據(jù)，這個(gè)數(shù)據(jù)通過(guò)插值語(yǔ)法等方式綁定到template中，這篇文章主要介紹了Vue中的偵聽(tīng)器watch,需要的朋友可以參考下2022-10-10
Vue利用mockjs編寫(xiě)假數(shù)據(jù)并應(yīng)用的問(wèn)題記錄
這篇文章主要介紹了Vue利用mockjs編寫(xiě)假數(shù)據(jù)并應(yīng)用,本文通過(guò)實(shí)例代碼給大家詳細(xì)講解，對(duì)Vue?mockjs數(shù)據(jù)相關(guān)知識(shí)感興趣的朋友跟隨小編一起看看吧2022-12-12
vue?cli?局部混入mixin和全局混入mixin的過(guò)程
這篇文章主要介紹了vue?cli?局部混入mixin和全局混入mixin的過(guò)程，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2022-05-05
如何解決Element-ui的el-table固定列后出現(xiàn)的表格錯(cuò)位問(wèn)題
這篇文章主要介紹了如何解決Element-ui的el-table固定列后出現(xiàn)的表格錯(cuò)位問(wèn)題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2024-09-09
詳解Vue學(xué)習(xí)筆記入門(mén)篇之組件的內(nèi)容分發(fā)(slot)
這篇文章主要介紹了詳解Vue學(xué)習(xí)筆記入門(mén)篇之組件的內(nèi)容分發(fā)(slot)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-07-07