如果token有, 但是过期了怎么办?

1. 前端是无法判断token是否过期了的, 所以当某次发请求把token带给后台做验证的时候

2. 后台发现token过期了, 则会返回响应状态码401

3. 但是你又不确定在哪个请求会401, 所以要用统一的响应拦截器做判断

4. 在src/utils/request.js中, 给自定义axios函数添加响应拦截器

import router from '@/router'
import { Message } from 'element-ui'


// 定义响应拦截器
request.interceptors.response.use(function(response) {
  // 响应状态码为 2xx或3xx 时触发成功的回调，形参中的 response 是“成功的结果”
  // return到axios原地Promise对象，作为成功的结果
  return response
}, function(error) {
  // console.dir(error)// 错误对象必须用dir来详细打印
  // 响应状态码是 4XX或5XX 时触发失败的回调，形参中的 error 是“失败的结果”
  // return到axios原地Promise对象位置，作为失败拒绝的状态（如果那边用try+catch或者catch幻术捕获，可以捕获到我们传递过去的这个变量的值）
  if (error.response.status === 401) {
    // 本次响应的token过期了
    // 清除vuex里面的一切，然后切换到登录页面（被动退出登录状态）
    store.commit('updateToken', '')
    store.commit('updateUserInfo', {})
    router.push('/login')
    Message.error('用户身份已经过期！！！')
  }
  return Promise.reject(error)
})