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"AccessToken")
  }
 });
}

var _this = this;
this.loading = true;
this.postRequest('/login', {
 username: this.loginForm.username,
 password: this.loginForm.password
}).then(resp=> {
 _this.loading = false;
 if (resp && resp.status == 200) {
 _this.getRequest("/config/hr").then(resp=> {
  if (resp && resp.status == 200) {
  var data = resp.data;
  _this.$store.commit('login', data);
  var path = _this.$route.query.redirect;
  _this.$router.replace({path: path == '/' || path == undefined "background-color: #ccffcc">添加Vue插件

由于我对axios进行了封装，因此在每一个需要使用axios的地方，都需要导入相应的请求，略显麻烦，参考https://cn.vuejs.org/v2/guide/plugins.html，我将请求方法挂到Vue上，具体操作如下：
1.在main.js中导入所有的请求方法，如下：


import {get} from './utils/api'
import {postRequest} from './utils/api'
import {deleteRequest} from './utils/api'
import {putRequest} from './utils/api'


2.把它们添加到 Vue.prototype 上，如下：


Vue.prototype.getRequest = getRequest;
Vue.prototype.postRequest = postRequest;
Vue.prototype.deleteRequest = deleteRequest;
Vue.prototype.putRequest = putRequest;


如此之后，以后再需要发送网络请求，就不需要导入api了，直接通过下面这种方式即可：
Post方法：


this.postRequest('/login', {
 username: this.loginForm.username,
 password: this.loginForm.password
}).then(resp=> {
 ...
 }
});


GET方法：


_this.get(
   this.url_s+"/Notice/findTotalCount",{
    userId:localStorage.getItem("userid"),
    openId: localStorage.getItem('openId')
   }
  )
  .then(function(res) {
   //
  })


以上这篇axios对请求各种异常情况处理的封装方法就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持。