axios 拦截器 的使用方法

有时候我们需要对axios发送的请求做统一处理，这里就需要使用拦截器

• 首先要创建一个axios示例

  import axios from 'axios'
  const $http = axios.create({
    baseURL: '/api/',
    timeout: 5000 // request timeout
  })

• 请求拦截器,在请求发起之前拦截处理

  // http response 拦截器
  $http.interceptors.response.use(
    config => {
        //拦截请求，做统一处理
        console.log('即将请求数据');
        console.log(config);
        return config
    },
    error => {
    return Promise.reject(error) 
  })

• 响应拦截器,在接口返回数据后 响应处理之前 拦截处理

  // http response 拦截器
  $http.interceptors.response.use(
    response => {
        //拦截响应，做统一处理
        console.log('数据请求成功');
        console.log(response);
        const res = response.data
        return res
    },
    //接口错误状态处理，也就是说无响应时的处理
    error => {
    return Promise.reject(error.response.status) // 返回接口返回的错误信息
  })

• 之后就可以把这个axios示例暴露出去，正常使用即可

  export default $http

本作品采用《CC 协议》，转载必须注明作者和本文链接