axios对请求各种异常情况处理的封装方法

前端采用了axios来处理网络请求，为了避免在每次请求时都去判断各种各样的网络情况，比如连接超时、服务器内部错误、权限不足等等不一而足，我对axios进行了简单的封装，这里主要使用了axios中的拦截器功能。

封装后的网络请求工具js如下

import axios from 'axios'import { Toast } from 'mint-ui'//请求时的拦截axios.interceptors.request.use(config => { return config;}, err => { Toast('请求超时!' ); return Promise.resolve(err);})//响应时的拦截axios.interceptors.response.use(data => { // 返回响应时做一些处理 // 第一种方式 const data = response.data // 根据返回的code值来做不同的处理（和后端约定） switch (data.code) {  case '0':   // 举例   // exp: 修复iPhone 6+ 微信点击返回出现页面空白的问题   if (isIOS()) {    // 异步以保证数据已渲染到页面上    setTimeout(() => {     // 通过滚动强制浏览器进行页面重绘     document.body.scrollTop += 1    }, 0)   }   // 这一步保证数据返回，如果没有return则会走接下来的代码，不是未登录就是报错   return data  // 需要重新登录  case 'SHIRO_E5001':   // 微信生产环境下授权登录   if (isWeChat() && IS_PRODUCTION) {    axios.get(apis.common.wechat.authorizeUrl).then(({ result }) => {     location.replace(global.decodeURIComponent(result))    })   } else {    // 否则跳转到h5登录并带上跳转路由    const search = encodeSearchParams({     next: location.href,    })    location.replace(`/user/login?${search}`)   }   // 不显示提示消息   data.description = ''   break  default: } // 若不是正确的返回code，且已经登录，就抛出错误 const err = new Error(data.description) err.data = data err.response = response // 第二种方式，我采取的 if (data.status && data.status == 200 && data.data.status == 'error') {  Toast(data.data.msg);  return data; } return data;},err => { // 当响应异常时做一些处理 if (err && err.response) {  switch (err.response.status) {   case 400: err.message = '请求错误(400)'; break;   case 401: err.message = '未授权，请重新登录(401)'; break;   case 403: err.message = '拒绝访问(403)'; break;   case 404: err.message = '请求出错(404)'; break;   case 408: err.message = '请求超时(408)'; break;   case 500: err.message = '服务器错误(500)'; break;   case 501: err.message = '服务未实现(501)'; break;   case 502: err.message = '网络错误(502)'; break;   case 503: err.message = '服务不可用(503)'; break;   case 504: err.message = '网络超时(504)'; break;   case 505: err.message = 'HTTP版本不受支持(505)'; break;   default: err.message = `连接出错(${err.response.status})!`;  } } else {  err.message = '连接服务器失败!' } Toast(err.message); return Promise.resolve(err);})//如果需要可以封装一些请求的方法let base = '';export const postRequest = (url, params) => { return axios({  method: 'post',  url: `${base}${url}`,  data: params,  transformRequest: [function (data) {   let ret = ''   for (let it in data) {    ret += encodeURIComponent(it) + '=' + encodeURIComponent(data[it]) + '&'   }   return ret  }],  headers: {   'Content-Type': 'application/x-www-form-urlencoded'  } });}export const uploadFileRequest = (url, params) => { return axios({  method: 'post',  url: `${base}${url}`,  data: params,  headers: {   'Content-Type': 'multipart/form-data'  } });}export const putRequest = (url, params) => { return axios({  method: 'put',  url: `${base}${url}`,  data: params,  transformRequest: [function (data) {   let ret = ''   for (let it in data) {    ret += encodeURIComponent(it) + '=' + encodeURIComponent(data[it]) + '&'   }   return ret  }],  headers: {   'Content-Type': 'application/x-www-form-urlencoded'  } });}export const deleteRequest = (url) => { return axios({  method: 'delete',  url: `${base}${url}` });}export const get = (url,params) => { return axios({  method: 'get',  url: `${base}${url}?`,  params: params,  headers:{   'Content-Type': 'application/x-www-form-urlencoded',   'Access-Token': localStorage.getItem("AccessToken")  } });}