封装axios请求

984 阅读1分钟
import { Message} from 'element-ui' //引入element弹窗组建
import loginInfo from '../store/loginInfo.js'
import router from '../router'//引入路由
var root = 'http://app.senpuyun.com/' // 配置API接口地址
var axios = require('axios') // 引用axios
// 自定义判断元素类型JS
function toType(obj) {
  return ({}).toString.call(obj).match(/\s([a-zA-Z]+)/)[1].toLowerCase()
}
// 参数过滤函数
function filterNull(o) {
  for (var key in o) {
    if (o[key] === null || o[key] === '' ) {
      delete o[key]
    }
    if (toType(o[key]) === 'string') {
      o[key] = o[key].trim()
    } else if (toType(o[key]) === 'object') {
      o[key] = filterNull(o[key])
    } else if (toType(o[key]) === 'array') {
      o[key] = filterNull(o[key])
    }
  }
  return o
}
// 封装axios
function apiAxios(method, url, params, success, failure) {
  if (params) {
    params = filterNull(params)
  }
  axios({
      method: method,
      url: url,
      data: method === 'POST' || method === 'PUT' ? params : null,
      params: method === 'GET' || method === 'DELETE' ? params : null,
      baseURL: root,
      withCredentials: true //开启cookies
    })
    .then(function (res) {
      if (res.data.status === 1000 || res.data.status === 1005 || res.data.status === 1010) {
        if (success) {
          if (Array.isArray(res.data.data) && res.data.data.length === 0) {//后台数据不规范,所以加了这个
            res.data.data.list = []
          }
          success(res.data)
        }
      } else {
        if (failure) {
          Message.error(res.data.msg)
          failure(res.data)
        } else if (res.data.status === 1016) {
          Message.error('登录失效,请重新登录!')
          loginInfo.setIslogin(false)
          router.push('/login')
        } else {
          Message.error(res.data.msg)
        }
      }
    })
    .catch(function (err) {
      if (err) {
        err = String(err)
        if (err.includes('Network Error')) {
          Message.error('请检查网络,网络端出错了哦')
        } else if (err.includes('TypeError: Cannot read property')) {
          return false
        } else {
          Message.error('服务端出错了哦')
        }
      }
    })
}

// 返回在vue模板中的调用接口
export default {
  get: function (url, params, success, failure) {
    return apiAxios('GET', url, params, success, failure)
  },
  post: function (url, params, success, failure) {
    return apiAxios('POST', url, params, success, failure)
  },
  put: function (url, params, success, failure) {
    return apiAxios('PUT', url, params, success, failure)
  },
  delete: function (url, params, success, failure) {
    return apiAxios('DELETE', url, params, success, failure)
  },
  root: root
}