axios源码分析笔记

1. 序

经常使用axios, 要知道axios比ajax功能强到什么, 为什么强!
建议读此文: Axios源码深度剖析 - AJAX新王者

2. axios优势

拦截器 interceptors
转换器
http请求: 对于node使用http[s].request ,对于html使用XHR

3. axios笔记

1. 和jquery的不同

jquery会生成多个对象, 而axios一般只会引用时生成一个单例,也可使用create函数个性化生成

精髓:
返回一个fn, 使得fn符合以下情况:
fn instanceof Axios;
fn.static === Axios.prototype.bind(context);
fn.this extend

2. 多级配置

default->method:get->this.default->request config

文章中问什么时候default和this.default不同?
我认为: import的时候相同,如果再调用create函数就不同了。

3. 如何拦截

主要是chain数组实现: [request, default, response] , 外加promise。then来实现

4. 调用

无论直接调用还是get、post调用,最终都是调用Axios.prototype.request函数

5. 取消请求

原理是调用http的abort,并把promise状态设置为reject

6. 超时、跨域

request.withCredentials = true;
axios.defaults.timeout = 3000;

7. 校验规则,数据转化

这些都是在chain的状态上加以实现的。

4. 总结

1. 为什么use可以自己添加拦截器?

use是静态函数
use最终会添加到chain数组中,
并且每次调用都是调用Axios.prototype.request
这样调用时候就有了对应的拦截功能。

2. 如何扩展

default默认配置,有四级联框,可个性化配置。
属性和函数配置: 那可参考**4.1<为什么use可以自己添加拦截器>**了

猜你喜欢

转载自blog.csdn.net/a519991963/article/details/114367476