axios 攔截器

我要學web發表於2020-11-04

axios 攔截器

攔截器:攔截每一次你的請求和響應,然後進行相應的處理
就是在你傳送請求或者獲得響應的時候所做的事情

設定攔截器

在這裡插入圖片描述

axios.interceptors.request.use(function (Cconfig) {
console.log(’ yes request 1’);
return Cconfig;
}, function (Cerror) {
console.log(’ no request 1’);
return Promise.reject(Cerror);
});
axios.interceptors.request.use(function (Cconfig) {
console.log(’ yes request 2’);
return Cconfig;
}, function (Cerror) {
console.log(’ no request 2’);
return Promise.reject(Cerror);
});
axios.interceptors.response.use(function (Cresponse) {
console.log(’ yes response 1’);
return Cresponse;
}, function (Cerror) {
console.log(’ yes response 1’);
return Promise.reject(Cerror);
});
axios.interceptors.response.use(function (Cresponse) {
console.log(’ yes response 2’);
return Cresponse;
}, function (Cerror) {
console.log(’ yes response 2’);
return Promise.reject(Cerror);
});

設定了請求攔截器和響應攔截器各2個

設定請求報文

在這裡插入圖片描述

axios({
url:‘http://localhost:3000/posts’,
})
.then(function(response){
console.log(‘i am yes’);
console.log(response.data);
console.log(response.request);
})
.catch(function(error){
console.log(‘i am no’);
console.log(error.message);
console.log(error.request);
})

結果
在這裡插入圖片描述

先設定的請求攔截器是放在後面執行的,

如果請求失敗
在這裡插入圖片描述
在這裡插入圖片描述

相關文章