Axios - axios实用封装

封装一个 axios

当 withCredentials = true时必须在后端增加 response 头信息 Access-Control-Allow-Origin，且必须指定域名，而不能指定为 *

import axios from 'axios'
import { Message } from 'element-ui'

const http = axios.create({
  timeout: 1000 * 120,
  withCredentials: true,	// 跨域请求时发送Cookie
  headers: {
    'Content-Type': 'application/json; charset=utf-8'
  }
})

/**
 * 封装的异常对象
 * @param message
 * @param code
 * @constructor
 */
function EipException(message, code) {
  this.msg = message
  this.code = code
}

/**
 * 请求拦截
 */
http.interceptors.request.use(config => {
  config.headers['token'] = getToken() // 请求头带上token
  return config
}, error => {
  return Promise.reject(error)
})

/**
 * get请求
 * @param url
 * @param params
 * @returns {Promise<any>}
 */
export function get(url, params = {}) {
  return new Promise((resolve, reject) => {
    http.get(url, {
      params: {...params, _t: new Date().getTime()}
    }).then(response => {
      resolve(response.data)
    }).catch(err => {
      reject(err)
    })
  })
}

/**
 * post 请求
 * @param url
 * @param data
 * @returns {Promise<any>}
 */
export function post(url, data = {}) {
  data = JSON.stringify(data)
  return new Promise((resolve, reject) => {
    http.post(url, data).then(response => {
      resolve(response.data)
    }).catch(err => {
      reject(err)
    })
  })
}

/**
 * delete 请求
 * @param url
 * @param data
 * @returns {Promise<any>}
 */
export function del(url, data = {}) {
  data = JSON.stringify(data)
  return new Promise((resolve, reject) => {
    http.delete(url, data).then(response => {
      resolve(response.data)
    }).catch(err => {
      reject(err)
    })
  })
}

/**
 * put 请求
 * @param url
 * @param data
 * @returns {Promise<any>}
 */
export function put(url, data = {}) {
  data = JSON.stringify(data)
  return new Promise((resolve, reject) => {
    http.put(url, data).then(response => {
      resolve(response.data)
    }).catch(err => {
      reject(err)
    })
  })
}

/**
 * 响应拦截
 */
http.interceptors.response.use(response => {
  const res = response.data
  // 异常拦截
  if (res && res.code !== 200) {
    // 错误信息统一在这里处理、页面代码只需要关系正常情况即可
    Message({
      message: response.data.msg || 'error',
      type: 'error',
      duration: 5 * 1000
    })
    throw new EipException(response.data.msg, response.data.code)
  } else {
    return res
  }
}, error => {
  if (error.message && error.message === 'Network Error') {
    Message({
      message: `服务无法访问，请确定当前终端是否能够访问`,
      type: 'error',
      duration: 5 * 1000
    })
    return Promise.reject(error)
  } else {
    Message({
      message: '接口无法访问',
      type: 'error',
      duration: 5 * 1000
    })
  }
  return Promise.reject(error)
})