axios 之cancelToken 請求中斷

181 阅读1分钟

今天發現網上搜的很多講的不夠清楚,很多只講get請求,沒有提到post和get的不同之處。

項目的基本用法:

let CancelToken = axios.CancelToken;

let source = CancelToken.source();

//get请求在第二个参数

axios.get('/mesage/xxxx', { cancelToken: source.token }).catch( function(thrown) { });

//post请求在第三个参数

axios.post('/mesage', { name: 'new name' }, { cancelToken: source.token });

source.cancel('请求終斷');(括號内的消息會在控制臺輸出)

CancelToken.source()方法,会产生一个token和cancel

原理方面:(源碼主要用的還是原生的abort方法取消请求)

CancelToken内部通過promise的resolve方法獲取控制权,让使用者可以自己调用resolve方法,通過source方法裏的cancel()方法调用abort方法取消请求然後用reject讓promise失敗。