axios源码解读系列之四 axios核心内容(get,post等方法实现)

190 阅读2分钟

在我们仔细看过defaults这个默认配置参数部分的源码后,继续深入实例化axios的过程

defaults对象传入createInstance后,首先实例化Axios类,传入这个默认配置,我们具体来看Axios

Axios是一个函数,实例化时初始化默认配置this.defaults以及拦截器this.interceptors,这个拦截器就是对我们发送的请求以及接受的响应数据做一定处理

然后我们可以看到,循环数组为Axios原型链添加delete,get,head,options方法,这些方法都是调用Axios类原型上的request方法,这些都是不需要传入数据data的方法,同理,为Axios原型链添加post,put,patch方法,这些方法调用request方法时要传入数据data,也就是说,我们在平时使用axios发送请求时候的这些请求方法,实际上是调用了axios内部的request方法

接下来我们看Axios原型链上的request方法: 首先,获取请求的配置信息config(用户传入和默认配置合并),取得请求方法,默认是get。在继续分析之前,我们首先来看interceptors做了什么

如上图,interceptors是InterceptorManager的实例,它维护一个handlers的数组,use方法可以让用户为handlers添加一个handler(axios.interceptors.request.use),每个handler是一个拦截器,其中fulfilled对应promise的then函数接收的函数,reject对应promise的catch接收的函数,eject方法根据索引移除指定handler,forEach方法则是循环执行所有handler。

接下来回到Axios文件,如上图,对于请求,会首先按照顺序依次所有用户注册的请求拦截器,然后使用dispatchRequest模块发送请求(dispatchRequest模块就是使用之前说过的adapter发送请求,具体我们下节分析),接下来对于接收的响应,再按顺序依次执行用户为响应注册的所有拦截器。这里的实现方式是用一个chain数组,初始化为包含dispatchRequest模块和undefined两个元素数组(为了和拦截器fulfilled,reject成对出现相匹配)然后在chain数组头部添加所有拦截器,用来对请求预处理,之后在chain末尾再次添加所有拦截器,用来对dispatchRequest请求后得到的响应做后处理,然后链式执行chain里的每个promise,最终返回响应结果(promise)。