经过一上午反复打磨，我完成了基于Axios的HTTP客户端封装。它实现统一错误处理、请求取消、自动重试等功能，支持TypeScript与多实例管理，解决了诸多开发痛点。

上回就已经承诺过大家，一定会出 HTTP 的系列文章，今天终于整理完成了。作为一个 web 开发，HTTP 几乎是天天要打交道的东西，但我发现大部分人对 HTTP 只是浅尝辄止，对更多的细节及原理就了解不深了，在面试的时候感觉非常吃力。这篇文章就是为了帮助大家树立完整的 HTT…

本文将给大家分享如何能够在一分钟内实现对 axios 的功能扩展，其中包括：取消重复请求、缓存数据、响应包装等！

应用场景 取消请求在前端有时候会用到，以下是两个工作中可能会用到的场景 tab切换时刷新某个列表数据，如果他们共用一个变量存储数据列表，当请求有延时，可能会导致两个tab数据错乱； 导出文件或下载文件

文章以图/文/代码案例三种结合的形式解读。毋庸置疑,前端缓存一定是前端架构者必定需要考虑的因素，也是开发者的巨大加分项。是前端性能优化中最重要的知识点之一。

屋里美团的姑娘喊我帮她写前端，忙到凌晨两点的我苦不堪言。为此我写了这篇文章《axios封装》希望他们在未来写出更好的前端代码。

Axios 是一个基于 promise 的 HTTP 库，可以用在浏览器和 node.js 中。 实际上，axios可以用在浏览器和 node.js 中是因为，它会自动判断当前环境是什么，如果是浏览器，就会基于XMLHttpRequests实现axios。如果是node.js环…

axios很好用，其中之一就是它的拦截器十分强大，我们就可以为请求和响应设置拦截器，比如请求拦截器可以在每个请求里加上token，做了统一处理后维护起来也方便，响应拦截器可以在接收到响应后先做一层操作，如根据状态码判断登录状态、授权。 这样可以把api统一管理起来，以后维护修改…

axios取消重复请求： 相同的接口在上一个pending状态时，自动取消下一个请求； 请求失败重试： 接口请求后台异常时候，自动重新发起多次请求；请求接口数据缓存：接口在设定时间内不会向后台获取数据