前后端分离,vue中以token来判断是否登录,但是token过期如何判断呢?我们可以通过挂载路由导航守卫和响应拦截器来判断在main.js加入如下代码
/* 响应拦截器 */ axios.interceptors.response.use(function (response) { // ①10010 token过期(30天) ②10011 token无效 if (response.data.code === 1003) { window.localStorage.removeItem('token'); router.replace({ path: '/login' // 到登录页重新获取token }) }else if (response.data.token) { // 判断token是否存在,如果存在说明需要更新token window.localStorage.setItem("token",response.data.token); // 覆盖原来的token(默认一天刷新一次) } return response }, function (error) { return this.$message.error(error) })
然后在路由文件挂载路由守卫Vue.use(VueRouter)
const routes = [ { path: '/', redirect: 'Login' }, { path: '/login', component: Login }, { path: '/home', component: Home, } ] const router = new VueRouter({ routes })
文章评论(0)