vue axios 封装

vue axios 封装

1、在request.js文件 引入axios

import axios from 'axios';

2、创建axios实例

const service = axios.create({
          baseURL: '', // api 的 地址
          timeout: 5000 // 请求超时时间
        })

3、reqreuest拦截器 所带参数给后台

service.interceptors.request.use(
          config => {
            return config
          },
          error => {
            // Do something with request error
            console.log(error) // for debug
            return Promise.reject(error)
          }
        )

4、response 拦截器 后台返回数据修改

 service.interceptors.response.use(
  response => {
    const res = response.data
    if (res.code !== 200) {
      message.warning(res.msg);
      const err = 'error'
      return Promise.reject(err)
    } else {
      return res.data
    }
  },
  error => {
    if (error.response.status === 401) {
      //清除登录
    } else{
      message.warning(error.response.data.message);
    }
    console.log(error.response) // for debug
    return Promise.reject(error)
  }
)

5、调用 /utils/request 封装的文件位置

import request from '@/utils/request';
export function 函数名（params ={}）{
    return request({
	    url:路径,
	    method: 请求方式,
	    params: params
  })
}

6、全部代码

    // 创建axios实例
    const service = axios.create({
      baseURL: '', // api 的 地址
      timeout: 5000 // 请求超时时间
    })

    // reqreuest拦截器
    service.interceptors.request.use(
      config => {
        return config
      },
      error => {
        // Do something with request error
        console.log(error) // for debug
        return Promise.reject(error)
      }
    )
    // response 拦截器
service.interceptors.response.use(
  response => {
    const res = response.data
    if (res.code !== 200) {
      message.warning(res.msg);
      const err = 'error'
      return Promise.reject(err)
    } else {
      return res.data
    }
  },
  error => {
    if (error.response.status === 401) {
     //清除登录
    } else{
      message.warning(error.response.data.message);
    }
    console.log(error.response) // for debug
    return Promise.reject(error)
  }
)

export default service