实现思路:
1.router中给需要登录后才能访问的页面配置meta:{needLogin:true}
2.登录页面,调用登录接口成功后,给cookie中存入用户信息(我这里是存uuid和sessionid相关内容)
3.request.js的接口请求拦截器中,根据接口返回的code值判断用户是否登录或登录是否已失效(我这里是未登录和已失效code==1000),失效的话,将cookie中的用户信息移除
4. main.js中使用router.beforeEach,步骤1设置的需登录才能访问的页面中,通过判断cookie中是否有用户的uuid和sessionid信息,确定用户是否已登录(未登录时uuid信息肯定不存在,但登录失效时uuid是存在的,所以要在步骤3中通过判断code值,清除uuid新增)。当用户未登录时跳转到登录页,并将当前页面的重定向路径带到登录页面地址中
1.router index.js 配置哪些页面需要登录才能访问
2.main.js判断用户是否已登录(我用的cookie存储的用户信息,存储方法在auth.js里。)
import Vue from 'vue'
import * as auth from '@/utils/auth'
//判断是否登录
router.beforeEach(function(to, from, next) {if(to.meta.needLogin) {//从cookie中获取用户信息,判断是否已登录
if(auth.getAdminInfo().userUuid) {
next();//表示已经登录
} else{//未登录
//next可以传递一个路由对象作为参数 表示需要跳转到的页面
next({
name:"login",
query: {redirect: to.meta.redirect}//登录后再跳回此页面时要做的配置
});
}
}else{//表示不需要登录
next(); //继续往后走
}
});
3.auth.j