XMLHttpRequest实现终止请求和超时

这里是使用的XMLHttpRequest2中的API,口蹄疫通过XMLHttpRequest对象的 abort( )方法 来取消正在进行的HTTP请求,abort( )方法是在XMLHttpRequest和XMLHttpRequest2中都可用的,调用abort( )方法在这个对象上触发abort事件。

调用abort( )的主要原因是完成像取消或超时请求消耗的是啊进太长或当响应变得无关时的情况
例如:使用XMLHttpRequest为文本输入域请求自动完成推荐,如果用户在服务器的建议到达之前输入了新的字符,这时等待请求就不再有用了,所有应该终止

XMLHttpRequest2中定义了 timeout 属性来指定请求自动终止的毫秒数,也定义了timeout事件用于超时发生时触发,但是到目前位置,浏览器还不支持这些自动超时,
但是我们可以使用setTimeout( )和abort( )方法来实现自己的超时

/*
发起HTTP GET请求获取指定URL的内容
如果响应成功到达,则传入responseText给回调函数
如果响应在timeout时间内没有到达,则中止请求
浏览器可能会在abort()后出啊发readystatechange
如果部分请求结果到达,甚至可能设置status属性
所有需要设置一个标记,当部分且超时的响应到达时不会调用回调函数
如果使用load(当请求完成时触发)事件就没有这个风险
*/
function(url,timeout,callback){
    var request = new XMLHttpRequest();
    var time = false;//是否超时
    var timer = setTimeout(function(){
        timeout = true;
        request.abort();//请求中止
    },timeout);
    request.open("GET",url);
    request.onreadystatechange = function(){
        if(request.readyState !==4) continue;//忽略未完成的请求
        if(timeout) return;//忽略中止请求
        clearTimeout(timer);//取消等待的超时
        if(request.status === 200)
            callback(request.responseText);
    }
    request.send(null);
}
  • 11
    点赞
  • 6
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值