1.根据条件取消
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><meta http-equiv="X-UA-Compatible" content="ie=edge"><title>Document</title><script src="/axios/0.19.0/axios.js"></script></head><body><script>let cancel;axios.interceptors.request.use(config=>{ // 在此处添加条件config['cancelToken'] = new axios.CancelToken(function(c){cancel = ccancel('强制取消了请求')})return config},err=>{return Promise.reject(err)}) axios.interceptors.response.use(res=>{cancel = null return res},err=>{cancel = null if(axios.isCancel(err)){console.log("取消上一个请求")// 中断promise链接return new Promise(()=>{})}else{// 把错误继续向下传递return Promise.reject(err)}}) function request(){axios.get("http://localhost:4000").then(res=>{console.log("res:",res)},err=>{console.log("err:",err)});}request()</script></body></html>
2.取消连续请求
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><meta http-equiv="X-UA-Compatible" content="ie=edge"><title>Document</title><script src="/axios/0.19.0/axios.js"></script></head><body><script>let cancel;axios.interceptors.request.use(config=>{// 实现上一个接口还未响应 下一个接口开始请求,把上一个接口取消if(typeof(cancel) === 'function'){cancel('强制取消了请求')}config['cancelToken'] = new axios.CancelToken(function(c){cancel = c})return config},err=>{return Promise.reject(err)}) axios.interceptors.response.use(res=>{cancel = null return res},err=>{cancel = null if(axios.isCancel(err)){console.log("取消上一个请求")// 中断promise链接return new Promise(()=>{})}else{// 把错误继续向下传递return Promise.reject(err)}}) function request(){axios.get("http://localhost:4000").then(res=>{console.log("res:",res)},err=>{console.log("err:",err)});}request()request()</script></body></html>