vue token 过期处理
2024-09-03 16:40:40
1.登陆成功后储存token 可以利用 vuex 储存token
2.利用路由守卫处理
router.beforeEach((to, from, next) => {
}）
3.我们可以判断进去的路由的名字是不是 login 如果没有token 或者 跳转的路径不是登陆页面 就跳转到登陆页面
如果有token && 跳转的是登陆页面 ，就跳转到主页面
if (!token && to.name !== LOGIN_PAGE_NAME) {
// 未登录且要跳转的页面不是登录页
next({
name: LOGIN_PAGE_NAME // 跳转到登录页
})
} else if (!token && to.name === LOGIN_PAGE_NAME) {
// 未登陆且要跳转的页面是登录页
next() // 跳转
} else if (token && to.name === LOGIN_PAGE_NAME) {
// 已登录且要跳转的页面是登录页
next({
name: homeName // 跳转到homeName页
})
} else {
if (store.state.user.hasGetInfo) {
turnTo(to, store.state.user.access, next)
} else {
store.dispatch('getUserInfo').then(user => {
console.log(token);
// 拉取用户信息，通过用户权限和跳转的页面的name来判断是否有权限访问;access必须是一个数组，如：['super_admin'] ['super_admin', 'admin']
turnTo(to, user.access, next)
}).catch(() => {
setToken('');
next({
name: 'login'
})
})
}
}
最新文章
- sql 时间(datetime)计算
- 十五天精通WCF——第十天 学会用SvcConfigEditor来简化配置
- Linux服务器开机没响应，BIOS信息都没有
- Node.js 究竟是什么
- MySQL5.6 replication architecture --原图来自姜承尧
- [转] Linux写时拷贝技术(copy-on-write)
- mysql不能插入中文数据
- GAN︱生成模型学习笔记（运行机制、NLP结合难点、应用案例、相关Paper）
- 微信小程序手机预览请求不到数据（最后一条不明所以）
- 如果在ie上报错又找不到问题原因该怎么办？
- SpringBoot设置文件上传大小限制--默认为1M
- CSS 3D transforms
- linux下配置nginx使用ftp目录作为静态资源文件的目标目录
- 【转】IT业给世界带来的危机
- POI简易帮助文档系列--读取Excel文件
- 搜索评价指标——NDCG
- ThinkPHP项目笔记之模板篇
- [C++] struct memory allocation
- SpringCloud微服务实战：一、Eureka注册中心服务端
- AI-Info-Micron-Menu：About Micron