diff --git a/src/store/modules/user.js b/src/store/modules/user.js index e8380ac..c047a23 100644 --- a/src/store/modules/user.js +++ b/src/store/modules/user.js @@ -1,5 +1,5 @@ // import { login, logout, getInfo } from '@/api/user' -import { getToken, setToken, removeToken } from '@/utils/auth' +import { getToken, setToken, removeToken, setTimeStamp } from '@/utils/auth' // 导入登录api import { getUserInfo, login, getUserDetailInfoById } from '@/api/user' @@ -138,6 +138,7 @@ const actions = { const res = await login(data) console.log('将登录页的逻辑移动到 vuex 里面') commit('setToken', res) + setTimeStamp() }, // 获取用户信息 async getUserInfo({ commit }) { diff --git a/src/utils/auth.js b/src/utils/auth.js index 0535f45..7ae52fc 100644 --- a/src/utils/auth.js +++ b/src/utils/auth.js @@ -1,6 +1,7 @@ import Cookies from 'js-cookie' const TokenKey = 'hr_token' // 设定一个独一无二的key +const timeKey = 'hr_timestamp_key' // 设置一个存时间戳的key export function getToken() { return Cookies.get(TokenKey) @@ -13,3 +14,16 @@ export function setToken(token) { export function removeToken() { return Cookies.remove(TokenKey) } + +// 设置时间戳的函数 +export function setTimeStamp() { + return Cookies.set(timeKey, Date.now()) +} +// 获取时间戳 +export function getTimeStamp() { + return Cookies.get(timeKey) +} +// 删除时间戳 +export function removeTimeStamp() { + return Cookies.set(timeKey) +} diff --git a/src/utils/request.js b/src/utils/request.js index 9115f8d..6dfab2f 100644 --- a/src/utils/request.js +++ b/src/utils/request.js @@ -1,9 +1,12 @@ import store from '@/store' import axios from 'axios' +import router from '@/router' +import { getTimeStamp } from '@/utils/auth' import { Message } from 'element-ui' // import { MessageBox, Message } from 'element-ui' // import store from '@/store' // import { getToken } from '@/utils/auth' +const timeout = 1 * 60 * 60 * 60 // create an axios instance const service = axios.create({ @@ -12,12 +15,22 @@ const service = axios.create({ timeout: 5000 // request timeout }) -// request interceptor // axios的请求拦截器 +// request interceptor // axios的请求拦截器, 两个参数 service.interceptors.request.use( - config => { + async config => { // 请求拦截器需要token的时候添加token if (store.getters.token && !config.headers.Authorization) { // 有token并且没有请求头 - config.headers.Authorization = `Bearer ${store.getters.token}` // 在请求头添加token + // 先判断时间戳是否过期 + // 如果时间戳已经过期, 1. 退出登录 2. 跳转登录页 3. 拦截剩下的请求 + // 如果没过期, 给请求头添加token + if (checkTimeout()) { + await store.dispatch('user/logout') + router.push('/login') + // debugger + return Promise.reject('登录已过期') + } else { + config.headers.Authorization = `Bearer ${store.getters.token}` // 在请求头添加token + } } return config }, err => { @@ -26,6 +39,12 @@ service.interceptors.request.use( } ) +// 校验时间戳函数 +const checkTimeout = () => { + const loginTimeStamp = getTimeStamp() + const nowTimeStamp = Date.now() + return nowTimeStamp - loginTimeStamp > timeout +} // response interceptor // service.interceptors.response.use( // /**