在 axios 庫中，我們一般使用 interceptors 對介面請求或者介面響應進行攔截，**如下：
$http.interceptors.request.use(config => , error => )而我們如何進行路由攔截呢？當然是使用 vue-router 全域性鉤子函式。
在 使用 vue-router 全域性守衛鉤子函式，根據登入狀態進行路由攔截以及滾動條回到頁面頂部 檔案中，我們使用 beforeeach 鉤子函式進行登入狀態的路由攔截；
除了對登入狀態進行攔截還可以對使用者是否認證進行攔截；當使用者認證過後才能訪問該路由；實現**如下：
// 需要登入的路由
const loginpages = [
'/certification',
'/order',
'/order-detail',
]// 需要認證
const authpages = [
'/order',
'/order-detail',
]router.beforeeach((to, from, next) => else ) // 將路由重置為from.path
return
}} // 判斷需要認證的路由
if (authpages.includes(to.path) && !utils.checkauth(store.state.user.userinfo.authstatus)) ) // 將路由重置為from.path
return
} next()
})
beforeEach前置路由守衛 vue
路由守衛 通過這個名詞顯而易見就類似於古代城池前士兵看守，你只有士兵認的通行證才能讓你進入，如果不符合或者沒有通行證那麼你無法進入這個城池，這也是為了安全起見。同樣vue中的路由守衛也是一樣的，一般用來攔截路由請求。使用場景 主要思想 需求說明 login.vue 以下 是登入介面 存的狀態 ses...
Vue 路由攔截 http攔截
登入攔截邏輯 第一步 路由攔截 首先在定義路由的時候就需要多新增乙個自定義欄位requireauth，用於判斷該路由的訪問是否需要登入。如果使用者已經登入，則順利進入路由，否則就進入登入頁面。const routes component repository 定義完路由後，我們主要是利用vue ro...
Vue 路由攔截
使用sessionstorage，beforeenter進行路由攔截var storage window.sessionstorage storage.setitem auth 1 this router.push teacher import myrouter from router index ...