【前端开发】Uniapp:路由拦截器配置

路由拦截器

  • 创建拦截器配置文件:permission.js
javascript 复制代码
// 获取登录token值
import { getToken } from '@/utils/auth'

// 登录页面
const loginPage = "/pages/login"
  
// 页面白名单
const whiteList = [
  '/pages/login',
  '/pages/register',
  '/pages/common/webview/index'
]

// 检查地址白名单
function checkWhite(url) {
  const path = url.split('?')[0]
  return whiteList.indexOf(path) !== -1
}

// 页面跳转验证拦截器
let list = ["navigateTo", "redirectTo", "reLaunch", "switchTab"]
list.forEach(item => {
  uni.addInterceptor(item, {
    invoke(to) {
      if (getToken()) {
        if (to.url === loginPage) {
          uni.reLaunch({ url: "/" })
        }
        return true
      } else {
        if (checkWhite(to.url)) {
          return true
        }
        uni.reLaunch({ url: loginPage })
        return false
      }
    },
    fail(err) {
      console.log(err)
    }
  })
})
  • 全局配置
javascript 复制代码
import '@/permission.js'
相关推荐
|晴 天|17 小时前
Vue 3 + TypeScript + Element Plus 博客系统开发总结与思考
前端·vue.js·typescript
猫32817 小时前
v-cloak
前端·javascript·vue.js
旷世奇才李先生17 小时前
Vue 3\+Vite\+Pinia实战:企业级前端项目架构设计
前端·javascript·vue.js
SoaringHeart19 小时前
Flutter进阶:用OverlayEntry 实现所有弹窗效果
前端·flutter
IT_陈寒21 小时前
Vite静态资源加载把我坑惨了
前端·人工智能·后端
herinspace21 小时前
管家婆实用贴-如何分离和附加数据库
开发语言·前端·javascript·数据库·语音识别
小码哥_常21 小时前
从MVC到MVI:一文吃透架构模式进化史
前端
嗷o嗷o21 小时前
Android BLE 的 notify 和 indicate 到底有什么区别
前端
豹哥学前端21 小时前
别再背“var 提升,let/const 不提升”了:揭开暂时性死区的真实面目
前端·面试
lar_slw1 天前
k8s部署前端项目
前端·容器·kubernetes