MDN说:可以使用AbortController.AbortController()构造函数来创建一个新的AbortController对象。与DOM请求的通信是使用AbortSignal对象完成的。对浏览器兼容性要求高。Chrome66及以上版本,firefox57及以上版本。由于这样的需求,我们用传统的XHR实现了这个功能。服务器使用koa2:/***@vividw*2019.1.10*/constKoa=require('koa');constapp=newKoa();constRouter=require('koa-router');constrouter=新路由器();const{resolve}=require('path');constkoaStatic=require('koa-static');constcors=require('@koa/cors');constsleep=(count)=>newPromise(resolve=>{setTimeout(resolve,count);});//router.get('/',async(ctx,next)=>{//ctx.body='你好,世界!';////awaitnext();//});router.get('/data',async(ctx,next)=>{awaitsleep(3000);ctx.body={data:'12345'}awaitnext();});app.use(cors()).use(koaStatic(resolve(__dirname+'/'))).use(router.routes()).use(router.allowedMethods());app。listen(3000,()=>{console.log('Apprunning!');});重点是setTimeout(ctx.body='12345',3000)不能直接使用;这样返回前端就直接报错了。前端代码:constownFetch=(count)=>newPromise((resolve,reject)=>{constxhr=newXMLHttpRequest();xhr.onreadystatechange=function(){if(xhr.readyState===4){if(xhr.status==200){resolve(xhr);}}}xhr.timeout=count;xhr.open('get','http://localhost:3000/data',true);xhr.send();})window.onload=()=>{consttimeout=(count)=>newPromise((resolve,reject)=>{setTimeout(()=>{reject('failed');},数数);});(async()=>{ownFetch(2000);})();}注意xhr.open()的第三个参数设置为true,将AJAX请求设置为异步,然后会因为超时请求而取消,所以xhr.abort()不需要显式取消要求
