SOURCE

/*
  **************************************************
  version: '0.10'
  author": "46898"
  description": axios封装 + 拦截器
  **************************************************
 */

import axios from 'axios'
import qs from 'qs'
import { errorMessage } from '@/utils'

let source
let pending = []
let CancelToken = axios.CancelToken
let removePending = (config) => {
  for (let p in pending) {
    if (pending[p].u === config.url + '&' + config.method + (config.data ? ('&' + JSON.stringify(config.data)) : '')) {
      pending[p].f()
      pending.splice(p, 1)
    }
  }
}

// 请求拦截器
axios.interceptors.request.use(config => {
  if (!navigator.onLine) {
    location.reload()
  }
  if (window.sessionStorage.getItem('token')) {
    config.headers.Authorization = window.sessionStorage.getItem('token')
  }  
  config.cancelToken = new CancelToken((c) => {
    const obj = Object.assign({ ...config }, { u: config.url + '&' + config.method + (config.data ? ('&' + JSON.stringify(config.data)) : ''), f: c })
    const isRepeatArr = pending.filter(item => item.u === obj.u).map(item => { c('中断重复请求') && removePending(item, true); return item })
    if (!isRepeatArr.length) {
      pending.push(obj)
    }
  })
  // csrf安全
  // 方法1
//   const csrfHeader = getCookie('csrf_header')
//   const csrfToken = getCookie('csrf_token')
//   if (csrfHeader && csrfToken) {
//     config.headers[csrfHeader] = csrfToken
//   }
// 方法2
//  config.xsrfCookieName = 'csrf_token'
//   config.xsrfHeaderName = 'X-CSRF-TOKEN'

// ie接口缓存问题
//   if (!!window.ActiveXObject || 'ActiveXObject' in window) {
//     config.headers['Cache-Control'] = 'no-cache'
//     config.headers['Pragma'] = 'no-cache'
//   }

  // config.headers.Authorization = AUTH_TOKEN

  return config
}, error => {
  return Promise.reject(error)
})

// 响应拦截器即异常处理
axios.interceptors.response.use(response => {  
  setTimeout(() => {
    removePending(response.config)
  }, 500)
  return new Promise(function (resolve, reject) {
    const { status, data, request: { responseType }, headers } = response
    if (status !== 200) {
      reject(response)
    } else {
      if (data) {
        if (data['resultCode'] === '200009') {
          resolve(data)
          sessionStorage.clear()
          !response.config.noReload && setTimeout(() => {               
            location.href = '#/login'
            // location.reload() 
          }, 1000)
        } else if (responseType === 'blob') {
          resolve({ header: headers, blob: data })
        } else {
          resolve(data)
        }
      } else {
        resolve(response)
      }
    }
  })
}, error => {
 if (axios.isCancel(error)) {
    pending = []
    console.error(error)
    return Promise.reject(error)
  }
  errorMessage(error)
  return Promise.reject(error['response'] || error)
})

const setDefaultHeaders = (resetStatus = false) => {
  if (resetStatus) {
    axios.defaults.headers = []
  }
  // axios.defaults.withCredentials = true
  // axios.defaults.headers.common['Authorization'] = AUTH_TOKEN
  axios.defaults.timeout = 300000
  axios.defaults.headers['X-Requested-With'] = 'XMLHttpRequest'
  axios.defaults.headers['Content-Type'] = 'application/json; charset=utf-8'
  // xsrfCookieName: 'csrftoken', // default: XSRF-TOKEN
  // xsrfHeaderName: 'x-csrftoken', // default: X-XSRF-TOKEN
  // withCredentials: true, // 表示跨域请求时是否需要使用凭证
}

const get = function (options) {
  return new Promise((resolve, reject) => {
    // let responseType = axios.defaults.responseType
    // if (options.type === 'edoc') {
    //   responseType = 'blob'
    // }
    const onDownloadProgress = options['onDownloadProgress'] || ((progressEvent) => { })
    let responseType = axios.defaults.responseType
    if (options.type === 'DOWNLOAD') {
      responseType = 'blob'
    }
    axios({
      method: 'get',
      url: VUE_APP_HOST + options['url'],
      params: options['params'],
      onDownloadProgress,
      responseType,
      noReload: options.noReload || false
    }).then(res => {
      resolve(res)
    }).catch(error => {
      reject(error)
    })
  })
}

const post = function (options) {
  const onUploadProgress = options['onUploadProgress'] || ((progressEvent) => { })
  const onDownloadProgress = options['onDownloadProgress'] || ((progressEvent) => { })
  let headers = options.headers || axios.defaults.headers
  let data = JSON.stringify(options.params)
  if (options['type'] === 'local') {
    return get(options)
  }
  if (headers['Content-Type']) {
    data = options.params
    if (headers['Content-Type'] === 'application/x-www-form-urlencoded;charset=utf-8') {
      data = qs.stringify(options.params)
    }
  }
  let responseType = axios.defaults.responseType
  if (options.type === 'DOWNLOAD') {
    responseType = 'blob'
  }
  return new Promise((resolve, reject) => {
    axios({
      method: 'post',
      url: VUE_APP_HOST + options['url'],
      data,
      headers,
      responseType,
      onUploadProgress,
      onDownloadProgress,
      cancelToken: new axios.CancelToken(function executor (c) {
        source = c
      }),
      noReload: options.noReload || false
      // maxContentLength: Infinity 解除Request Body大小限制,默认2000
    }).then(res => {
      resolve(res)
    }).catch((error) => {
      reject(error)
    })
  })
}

const cancelRequest = function () {
  if (typeof source === 'function') {
    source('终止请求')
  }
}

setDefaultHeaders()

export default {
  post,
  get,
  cancelRequest
}
console 命令行工具 X clear

                    
>
console