VUE+axios拦截器，对于项目里所有数据交互的 ‘’前提判断‘’

今天做项目需要用到客户登录验证，没有判断否存在token与401响应判断，如有需要请参考
https://blog.csdn.net/u012369271/article/details/72848102/

运用axios自带的http response 服务器响应拦截器，判断返回内容中的数值，从而达到自己想要的效果

创建一个axios实例

import axios from 'axios'

const service = axios.create({
  baseURL: 'http://xxxx', // url = base url + request url
  headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
  withCredentials: true, // 当跨域请求时发送cookie
  timeout: 25000 // request timeout
})

服务器请求拦截

service.interceptors.request.use(
  config => {
    // 在发送请求之前做些什么

    if (store.getters.token) {
      // 让每个请求携带令牌
      // ['X-Token'] 是一个自定义头键
      // 请根据实际情况修改
      config.headers['X-Token'] = getToken()
    }
    return config
  },
  error => {
    // 处理请求错误
    console.log(error) // for debug
    return Promise.reject(error)
  }
)

服务器响应拦截

axios.interceptors.response.use(// http response 服务器响应拦截器
  response => {
    console.log(response.data)   // response 获取到后台传过来的数据
    if(response.data.status==-1){   //判断自己所需的值
      history.go(0)
    }
    return response;   //输出（不可缺少）
  });

最后抛出

export default service

在api页面进行引用

import request from '@/utils/request'
import qs from 'qs'

export function login(data) {
  return request({
    url: '/login/login',
    method: 'post',
    data: qs.stringify({
      adUsername: data.username,
      adPassword: data.password
    })
  })
}