配置请求头 请求拦截器 响应拦截器

1丶配置请求头

const request = axios.create({
  baseURL: 'http://ttapi.research.itcast.cn/' // 基础路径
})

2丶配置请求拦截器

import axios from 'axios'
import store from '@/store'

// 请求拦截器
request.interceptors.request.use(
  function(config) {
    // config ：本次请求的配置对象
    // config 里面有一个属性: headers
    const user = store.state.user
    console.log(user)
    if (user && user.token) {
      config.headers.Authorization = `Bearer ${user.token}`
    }
    return config
  },
  function(error) {
    return Promise.reject(error)
  }
)
export default request

3丶配置响应拦截器

import Vue from 'vue'
import App from './App'
import router from './router'
import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css'
import axios from 'axios'
// 引入store
import store from './store'

//与后端定义状态是100签名错误 跳转到登录界面
axios.interceptors.response.use(
  response => {
    //当返回信息为未登录或者登录失效的时候重定向为登录页面
    if (response.data.status == 100 || response.data.message == '用户未登录或登录超时，请登录！') {
      router.push({
        path: "/",
        querry: { redirect: router.currentRoute.fullPath }//从哪个页面跳转
      })
    }
    return response;
  },
  error => {
    return Promise.reject(error)
  }
)

以上代码写在request.js文件里