php使用axios发送请求,axios源码之模拟实现axios发送请求
axios內(nèi)部運(yùn)作流程大致如下axios入口-
->axios構(gòu)造函數(shù)-
->interceptors請(qǐng)求攔截器-
->dispatchRequest方法-
->transformRequest請(qǐng)求轉(zhuǎn)換器-
->adapter適配器-
->transformResponse響應(yīng)轉(zhuǎn)換器-
->interceptors響應(yīng)攔截器
具體模擬實(shí)現(xiàn)axios使用dispatchRequest方法，以及adapter適配器發(fā)送一個(gè)異步請(qǐng)求的核心代碼//模擬axios發(fā)送請(qǐng)求
//1、聲明構(gòu)造函數(shù)
function Axios(config){
this.config = config;
}
//為Axios的原型對(duì)象添加request方法,axios(),axios.get()等，核心就是調(diào)axios.request()方法
Axios.prototype.request = function(config){
//創(chuàng)建一個(gè)promise對(duì)象
let promise = Promise.resolve(config);
//聲明一個(gè)數(shù)組，保存promise的then方法的兩個(gè)參數(shù)
let chains = [dispatchRequest, undefined]; //undefined作用是占位
//調(diào)用then方法，指定回調(diào)
let result = promise.then(chains[0],chains[1]);
//返回promise的結(jié)果
return result;
}
//2、dispatchRequest函數(shù)
function dispatchRequest(config){//該函數(shù)的返回結(jié)果必須是一個(gè)promise對(duì)象
//調(diào)用適配器發(fā)送請(qǐng)求
return xhrAdapter(config).then(response => {
//省略對(duì)響應(yīng)結(jié)果進(jìn)行轉(zhuǎn)換處理
return response;
},error=>{
throw error;
})
}
//3、adapter適配器
function xhrAdapter(config){ //該函數(shù)的返回值也是promise
return new Promise((resolve,reject)=>{
//不考慮請(qǐng)求體的發(fā)送，創(chuàng)建一個(gè)異步請(qǐng)求
let xhr = new XMLHttpRequest();
xhr.open(config.method, config.url);
xhr.send();
//綁定事件
xhr.onreadystatechange = function(){
if(xhr.readyState === 4) {
if(xhr.status >= 200 && xhr.status < 300) {
resolve({
//自定義返回?cái)?shù)據(jù)
config: config, //配置對(duì)象
data: xhr.response, //響應(yīng)體
headers: xhr.getAllResponseHeaders(),
request: xhr,//請(qǐng)求對(duì)象
status: xhr.status,//響應(yīng)狀態(tài)碼
statusText: xhr.statusText //響應(yīng)狀態(tài)字符串
})
} else {
reject(new Error('請(qǐng)求失敗狀態(tài)碼為'+xhr.status))
}
}
}
})
}
//測(cè)試創(chuàng)建axios函數(shù)
let axios = Axios.prototype.request.bind(null)
//用axios發(fā)送請(qǐng)求
axios({
method:'GET',
url:'http://localhost:3000/posts'
}).then(res=>{
console.log(res)
})
總結(jié)
以上是生活随笔為你收集整理的php使用axios发送请求,axios源码之模拟实现axios发送请求的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇： Python学习笔记：线程和进程（合），
- 下一篇： php视频降清晰度,使用FFMPEG降低