在vue中，什么时候需要导出js文件
当js中定义了函数需要被其他模块调用的时候，需要用export导出js，如果只需要执行整页js语句，则不用导出，直接用import 'js文件名' 引入即可
登录路由守卫设置逻辑
在premission中设置路由控制
- 首先导入路由，因为一会要使用router.beforeEach()//前置路由守卫
import router from '@/router' - 然后导入store,一会判断token是否获取到token
import store from '@/store' - 分析逻辑
var whiteList=['404','/login']
//---1---.在前置路由守卫中判断是否有token
router.beforeEach(to,from.next){
if(store.getters.token){
//---2---.如果有token，说明已经登录，判断访问的页面是否为login页面
if(to.path === '/login'){
//(1)如果是login页面，则直接跳转到首页
next('/')
}else{
//(2)如果不是login页面，直接放行
next()
}
}else{
//---3---.如果没有token，说明没有登录
if(whiteList.indexOf(to.path)){
//--(1)--判断访问地址是否在白名单中,白名单提前以数组的方式设置出来(见第一行)
//--(2)--如果存在于白名单中，则放行
next()
}else{
//如果不存在于白名单，则跳转到login登陆页面
next('/login')
}
}
}
获取用户信息的逻辑
---1.----首先封装api
//获取用户信息不需要传递信息，但是需要token授权
//考虑到页面许多地方需要使用到token，所以我们在请求拦截器的地方设置携带token的请求头
实现代码：
--(1)--service.interceptors.request.use(config=>{
//config是请求的配置信息
if (store.getters.token) {
// 判断是否有token
// 注入token
config.headers["Authorization"] = `Bearer ${store.getters.token}`;
}
return config; //这里必须返回的，不然没有配置信息
},error=>{
return Promise.reject(error)
})
//这样我们能在其他地方也不需要专门携带token去做请求了
--(2)--封装api略
---2---为了提高页面性能，我们不要每次登陆页面都访问服务器获取用户信息，如果之前没有获取过用户信息，才获取，判断方法：在vuex的user子模块中添加一个userinfo数组，用于保存用户信息，判断里面是否存在用户id ,如果没有，则请求数据
if(!store.getters.userid){
store.dispatch('user/getuserinfo')
}
判断token是否过期
效果：当页面刷新或者用户登录的时候，判断token存在的时长，为了安全性，超过指定的时间，就让用户重新登陆
1.在auth.js中用cookie插件做两个方法，一个用于存储生成token并存储到本地的时间戳，一个用于读取这个时间戳，
//如果想存储到cookie中，要先创建一个key
const timeKey = "hrsaas-timestamp-key"; // 设置一个独一无二的key用于标记时间戳
//这个用来获取时间戳
export const getTimeStamp(){
return Cookies.get(timeKey)
}
//这个用于将当前时间设置为时间戳
export const setTimeStamp(){
return Cookies.set(timeKey,Date.now())
}
2.在判断是否有token的逻辑中判断时间戳的有效性,即在请求拦截器中判断
(1).首先我们需要设置一个限定时间，单位为毫秒
const TimeOut=3000
(2).引入方法，设置一个函数，返回值为判断当前时间戳减去获取的时间戳是否大于timeKey
function checkTimeOut(){
const currentTIme = getTimeStamp()
const nowTime = Date.now()
return (nowTime - currentTime)/1000>TimeOut
}
(3)在判断是否存在token的true逻辑中引入上边的函数，如果为true则说明token已经过期了，则让用户重新登录
if(checkTimeOut()){
router.push('/login)
//引入lotOut逻辑函数此处省略
return Promise.reject(new Error("token超时了"));
}
