封装一个axios的思路_axios封装思路-CSDN博客

本文链接：https://blog.csdn.net/cqxxtxx/article/details/135171338

本文详细介绍了如何封装axios，包括配置基础信息（如URL、超时、headers），利用lodash的mergeWith合并配置，处理超时错误、token验证、请求参数区分以及响应拦截，确保请求的正确性和错误处理机制。

摘要由CSDN通过智能技术生成

封装一个axios的思路

1.配置请求基本信息的常量:(用于基本处理)

2. BASE_ URL :根据环境变量，针对生成、测试、开发环境配置对应的url

3. TIMEOUT:配置接口请求超时时间。

4. headers:配置请求头

5. validateStatus: 定义HTTP响应状态码的范围。如果validateStatus返回true (或被设为null promise 将被解析;否则，promise将被拒绝。可以请求接口的不同，封装axios的时候，将请求基本信息的常量通过参数的方式单独进行配置。

扩展: 具体方法:通过lodash的mergeWith方法将默认的option配置和手动配置的globalOption，通过递归的形式合并成一个option请求拦截 timeout:在axios的源代码中，超时后，会在拦截器那里axios.interceptors.response捕抓到错误信息，且error . code="ECONNABORTED",可以根据这个code提示超时报错信息。token:统一在http请求的header都加上token,这样后台根据token判断你的登录情况，即使本地存token，也有可能token是过期的，所以在响应拦截器中要对返回状态进行判断other errors:根据请求状态status直接promise.reject.路由跳转到对应的报错页面。根据请求头和method来处理入参的格式在使用axios时，注意到配置选项中包含params和data两者，以为他们是相同的，实则不然。因为params是添加到url的请求字符串中的，用于get请求。而data是添加到请求体(body)中的，用于post请求。响应拦截 badStatusMap:请求失败，根据HTTP响应. 状态码做出对应的messageTip