使用場景:
- 適用于需要登錄才能訪問的 uni-app 應用
- 保護需要認證的頁面不被未授權用戶訪問
- 統一處理路由跳轉的權限控制
@/utils/cookies.js
下的部分代碼內容:
// #ifdef H5
import Cookies from 'js-cookie'
// #endif// ums
const tokenKey = 'user_center_token'export const getUmsToken = () => {// #ifdef H5return Cookies.get(tokenKey)// #endif// #ifdef APP-PLUSreturn plus.navigator.getCookie(tokenKey)// #endif
}
@/store/modules/user.js
下的部分代碼內容:
// src/store/user.js
export const useUserStore = defineStore('user',() => {......const setLogOut = _ => {uni.reLaunch({url: '/pages/login/index'})}......return {......setLogOut......}},{// persist: true // 配置持久化......}
)
export function useOutsideUserStore() {return useUserStore(g_store)
}
// 從 cookies 工具中導入獲取 UmsToken 的方法
import { getUmsToken } from '@/utils/cookies'// 封裝路由跳轉攔截器對象
const routeInterceptor = {/*** 路由跳轉前的攔截邏輯* @param {Object} args - 路由參數對象* @returns {boolean} - 返回 false 表示攔截跳轉,true 表示允許跳轉*/invoke(args) {// 從用戶 store 中獲取設置登出的方法const { setLogOut } = useUserStore()// 檢查條件:1. 沒有 UmsToken 且 2. 目標路由不是登錄頁if (!getUmsToken() && !args.url.includes('/pages/login/index')) {// 顯示提示 toastuni.showToast({title: '請先登錄',icon: 'none' // 不使用圖標})// 執行登出操作setLogOut()// 返回 false 攔截路由跳轉return false}// 允許路由跳轉return true},/*** 路由跳轉成功回調(暫未實現具體邏輯)* @param {Object} args - 路由參數*/success(args) {// console.log('routeInterceptor-success', args)// 可在此處添加路由跳轉成功后的跟蹤邏輯},/*** 路由跳轉失敗回調(暫未實現具體邏輯)* @param {Error} err - 錯誤對象*/fail(err) {// console.log('routeInterceptor-fail', err)// 可在此處添加路由跳轉失敗的異常處理},/*** 路由跳轉完成回調(無論成功失敗都會觸發,暫未實現具體邏輯)* @param {Object} res - 結果對象*/complete(res) {// console.log('routeInterceptor-complete', res)// 可在此處添加路由跳轉完成的統一處理}
}// 為四種路由跳轉方法添加攔截器
uni.addInterceptor('navigateTo', routeInterceptor) // 添加普通跳轉攔截
uni.addInterceptor('redirectTo', routeInterceptor) // 添加重定向跳轉攔截
uni.addInterceptor('reLaunch', routeInterceptor) // 添加重新啟動應用攔截
uni.addInterceptor('switchTab', routeInterceptor) // 添加切換 Tab 頁攔截
在main.js
引入 import './utils/route.js'
注意事項:
- 確保 getUmsToken 方法能正確獲取 token
- 登錄頁路徑需要與實際路由配置一致
- 可以根據需要擴展 success/fail/complete 的邏輯
- 在不需要攔截的路由(如公開頁面)可以不做特殊處理