#hash模式和history模式(深入瞭解)
#登錄攔截
方式之一:後端攔截,這種方法需要將前端打包,部署到後端
#攔截器的簡單邏輯
1)用戶訪問URL
2)檢測該URL是否爲登錄界面
3)是則不攔截,不是則檢測是否爲登錄狀態
4)登錄狀態不攔截,未登錄則跳轉到登錄界面
#前端攔截
Vuex:它是專門爲 Vue 開發的狀態管理方案,我們可以把需要在各個組件中傳遞使用的變量、方法定義在這裏
引入vuex:
1)cnpm install vuex --save
2)創建/src/store/index.js 不理解
3)修改路由配置
在需要攔截的路由下添加一條元數據
4)使用鉤子函數判斷是否攔截
鉤子函數:在某些時刻會被調用函數
src/main.js 添加對store的引用
修改vue對象,添加store
添加beforeeach()鉤子函數
修改login.vue
攔截設計總體流程:
使用vuex保存登錄界面的用戶狀態——》修改路由配置,使登錄頁面的路由可進行攔截——》添加鉤子函數,進行攔截處理
#同時運行前後端項目,訪問 http://localhost:8080/index ,發現頁面直接跳轉到了 http://localhost:8080/login?redirect=%2Findex
Q:可以直接訪問 http://localhost:8080/index
A:換一個瀏覽器才能實現攔截效果