ios 请求失败封装_axios请求封装和异常统一处理

当前后端分离时，权限问题的处理也和我们传统的处理方式有一点差异。笔者前几天刚好在负责一个项目的权限管理模块，现在权限管理模块已经做完了，我想通过5-6篇文章，来介绍一下项目中遇到的问题以及我的解决方案，希望这个系列能够给小伙伴一些帮助。本系列文章并不是手把手的教程，主要介绍了核心思路并讲解了核心代码，完整的代码小伙伴们可以在GitHub上star并clone下来研究。另外，原本计划把项目跑起来放到网上供小伙伴们查看，但是之前买服务器为了省钱，内存只有512M，两个应用跑不起来(已经有一个V部落开源项目在运行)，因此小伙伴们只能将就看一下下面的截图了，GitHub上有部署教程，部署到本地也可以查看完整效果。

前面几篇文章，我们已经基本解决了服务端的问题，本文我们主要来聊聊前端网络请求的封装。

本文是本系列的第四篇，建议先阅读前面的文章有助于更好的理解本文：

前端网络请求封装

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

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

import axios from 'axios'

import {Message} from 'element-ui'

axios.interceptors.request.use(config=> {

return config;

}, err=> {

Message.error({message: '请求超时!'});

return Promise.resolve(err);

})

axios.interceptors.response.use(data=> {

if (data.status && data.status == 200 && data.data.status == 'error') {

Message.error({message: data.data.msg});

ret