Axios 是一個基于 promise 的 HTTP 庫,可以用在瀏覽器和 node.js 中梢夯。很多情況我們要對請求和其響應(yīng)進(jìn)行特定的處理烘挫;如果請求數(shù)非常多,單獨(dú)對每一個請求進(jìn)行處理會變得非常麻煩雳锋。好在強(qiáng)大的axios為開發(fā)者提供了這樣一個API:攔截器黄绩。攔截器分為 請求(request)攔截器和 響應(yīng)(response)攔截器。
安裝 axios,qs
npm install axios –save-dev
安裝 qs
npm install qs –save-dev
請求攔截器
//引入axios和 qs
import axios from "axios";
import qs from "qs";
/****** 創(chuàng)建axios實(shí)例 ******/
const serve = axios.create({
baseURL: process.env.BASE_URL, // api的基本url玷过,也可以直接寫定好的url
timeout: 5000 // 請求超時時間
});
serve.interceptors.request.use(config => {
config.method === 'post'
? config.data = qs.stringify({...config.data})
: config.params = {...config.params};
config.headers['Content-Type'] = 'application/x-www-form-urlencoded';
return config;
}, error => { //請求錯誤處理
Promise.reject(error)
}
);
響應(yīng)攔截器
serve.interceptors.response.use(
response => { //成功請求到數(shù)據(jù)
//這里根據(jù)后端提供的數(shù)據(jù)進(jìn)行對應(yīng)的處理
if (response.data.result === 'TRUE') {
return response.data;
} else {
//打印錯誤信息
console.error(response.data.data.msg)
}
},
error => { //響應(yīng)錯誤處理console.log('error');
console.error(error);
console.error(JSON.stringify(error));
let text = JSON.parse(JSON.stringify(error)).response.status === 404
? '404'
: '網(wǎng)絡(luò)異常爽丹,請重試';
alert(text)
return Promise.reject(error)
}
)
最后編輯于 :
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者