登录超时，返回到登录页面 vue

登录超时，返回到登录页面 vue

1. 首先登录的时候，将登录接口返回的token用localStorage保存起来，然后在axios的请求拦截里将token添加到请求头部header里，作为之后前后端的通信票据

axios.interceptors.request.use(config => {
    var data = {}
    if (typeof (config.data) === 'string') {
        let str = `'${config.data}'`
        str = str.substring(1, str.length - 1)
        data = JSON.parse(str)
    } else {
        data = config.data
    }
	// 判断是否是登录和注册接口，因为登录和注册接口不需要在请求头里加token
    var isLoginRegiste = ['login', 'registe'].indexOf(data.methods) !== -1 
    if (!isLoginRegiste) {
        // 如果不是登录和注册接口，说明用户已经登录，然后在请求头里添加token
        config.headers.token = localStorage.token
    }
    //因为axios版本问题，请求拦截必须返回config
    return config; 
})

2. 在axios的响应拦截里处理，判断后端接口返回的状态码，根据状态码判断登录是否超时，如果超时，那么跳转到登录页面，并且需要清空浏览器的缓存：

import 'router' from 'vue-router'
import { Message } from 'element-ui'
axios.interceptors.response.use(response => {
    var data = response.data
    if (data.code === 23001) {
        // 登录超时 - 23001
        var msg = '登录超时'
        Message({
            message: msg,
            type: 'error',
            duration: 3 * 1000
        })
        router.push('/login')
        // 清除浏览器缓存
        localStorage.removeItem('token')
    } else {
        // 响应正常，返回数据即可
        return data
    }
})