Axios 攔截器 取消請求

標籤：function   cep   func   函數   throw   inter   catch   intercept   port   

axios 最常用的功能之一，攔截器

axios.interceptors.response.use(  response => {    let {data: json} = response    let resp = json    if(resp.code === 200) return resp;    throw new Error(resp.msg)  },  error => {      return Promise.reject(error)    }  },)

在後台返回資料後，檢測狀態代碼為 200 ，則返回資料，否則，拋出異常

另外一個功能，取消請求，以下來自官方

var CancelToke = axios.CancelToken;var source = CancelToken.source();axios.get(‘/user/12345‘, {    cancelToken:source.toke}).catch(function(thrown){    if(axiso.isCancel(thrown)){        console.log(‘Rquest canceled‘, thrown.message);    }else{        //handle error    }});//取消請求(資訊參數設可設定的)source.cancel("操作被使用者取消");

或者給 CancelToken 建構函式傳遞一個executor function來建立一個cancel token

var CancelToken = axios.CancelToken;var cancel;axios.get(‘/user/12345‘, {    cancelToken: new CancelToken(function executor(c){        //這個executor 函數接受一個cancel function作為參數        cancel = c;    })});//取消請求cancel();

//多數情況，我們封裝的方法都是通過 export 輸出，
//所以 cancel 我們也可以通過 export 輸出，這樣就可以在主業務中隨時調用export { cancel }

 

Axios 攔截器 取消請求