http cancelled状态与ajax 超时

时间:2023-02-06 15:06:18

在最近一周,我们的前端在测试某些批量超过的某个步骤时,发现请求好像发出来,但是后台状态没有变化,说是最近才出现的问题,以前一直都是正常的,两天连续出现两次之后,来找笔者,首先检查了下中间件的日志,发现请求已经过来了,但是到mysql时执行出现了异常,没发现逻辑有什么奇怪。因为web端有一些判断操作决定后续更改执行状态的操作,所以我们需要知道问题在哪个环节开始出错的,经查web层,没有任何异常。

于是F12,看了下,发现经过大约5-10s后,http的状态变成了cancelled,后查看提交的ajax请求,发现设置了timeout超时时间为5000。由于出异常后,中间件没有在超时时间内将异常信息返回给web端,进而导致ajax请求超时,并发送了http cancel。所以出现了这个Http cancelled状态。

var ajaxTimeoutTest = $.ajax({
  url:'', //请求的URL
  timeout : 1000, //超时时间设置,单位毫秒
  type : 'get', //请求方式,get或post
  data :{}, //请求所传参数,json格式
  dataType:'json',//返回的数据格式
  success:function(data){ //请求成功的回调函数
    alert("成功");
  },
  complete : function(XMLHttpRequest,status){ //请求完成后最终执行参数
    if(status=='timeout'){//超时,status还有success,error等值的情况
      ajaxTimeoutTest.abort();
      alert("超时");
    }
  }
}); 设置timeout的时间,通过检测complete时status的值判断请求是否超时,如果超时执行响应的操作。