登录的时候输入密码存到cookie里，可以由个人选择加密方式，每次在路由跳转的时候利用router.beforeEach((to, from, next) 判断是否有token，如果有，发送到服务端验证，如果通过，就继续路由，如果没有，就重定向到登录界面。
鉴权也是一样的道理，在router配置中加上 meta: { role: ['Administrator'] }，在router.beforeEach（）中判断要去的那个界面是否需要权限。并且侧边栏是根据可访问的路由动态生成的，不同级别的用户可以看到的侧边栏是不一样的，这就在一定程度上做到了简单的权限管理的功能。
router.beforeEach((to, from, next) => {
// console.log(to)
NProgress.start(); // 开启Progress
if (store.getters.token) { // 判断是否有token
// alert('dont need login ');
if (to.path === '/login') {
next({ path: '/' });
}
else {//如果不是去login 而是其他需要判定权限的
// console.log(store.getters.roles)
if (store.getters.roles.length === 0) { // 如果当前用户没有拉取完user_info信息
store.dispatch('GetInfo').then(res => { // 拉取user_info
const roles = res.data.role;
store.dispatch('GenerateRoutes', { roles }).then(() => { // 生成可访问的路由表
router.addRoutes(store.getters.addRouters) // 动态添加可访问路由表
// console.log(store.getters.addRouters);
next({ ...to }); // hack方法 确保addRoutes已完成
})
})
} else {
// 没有动态改变权限的需求可直接next() 删除下方权限判断 ↓
if (hasPermission(store.getters.roles, to.meta.role)) {
// console.log(to.meta.role)
// console.log("has permission");
next();//
} else {
// console.log("has no permission");
next({ path: '/', query: { noGoBack: true } });
}
// 可删 ↑
}
}
} else {
if (whiteList.indexOf(to.path) !== -1) { // 在免登录白名单，直接进入
next()
} else {
alert('please login');
next('/login'); // 否则全部重定向到登录页
NProgress.done(); // 在hash模式下 改变手动改变hash 重定向回来 不会触发afterEach 暂时hack方案 ps：history模式下无问题，可删除该行！
}
}
});
