日期:2014-05-16  浏览次数:20645 次

检查超时---Ajax之四

有时发出一个请求,后端什么时候返回前端并不清楚。有可能是1秒,3秒甚至更长时间。因此有必要添加一个参数来设置等待的时间,如果在设定的时间内没有返回结果则放弃该次请求。

实现思路:发出请求后指定一个时间,如超过该时间没有返回结果则忽略。window对象的setTimeout方法再次起左右了(setTimeout能解决很多IE下古怪的bug)

代码大概如下:

var timeout = opt.timeout || 0;//指定是否启用请求超时处理,不传参数timeout则忽略

var isTimeout = false; //一个标志位,是否超时

if(timeout>0){
	setTimeout(function(){
		isTimeout = true;
	},timeout);
}

//最后将isTimeout用在onreadystatechange处理中
xhr.onreadystatechange = function(){
	if (xhr.readyState == 4 && !isTimeout){//当请求完成,且没有超时才处理结果
		_onStateChange(xhr, type, success, failure);
	}else{}
};

?

测试这样写

Ajax.text('../servlet/Ajax',{
	timeout : 2000,
	success : function(){},
	failure : function(){}
});

?

后台我用servlet,直接sleep下即可模拟超时(sleep时间3000大于timeout的设置2000)

try {
	Thread.sleep(3000);
} catch (InterruptedException e) {
	e.printStackTrace();
}
response.setContentType("text/html");
PrintWriter out = response.getWriter();
out.println("request success");
out.flush();
out.close();

?

源码见附件

?

?

<<精通JavaScript>>,JQuery作者John Resig著,该书示例也是如此处理,见175页。虽然John写书如此实现,但JQuery库并非如此。

TX nick 发给偶参考的库也是如此处理。

请求超时后,success/failure都不会被调用。这样处理有一定的合理性,但缺陷也显而易见,用户不知是超时了还是其它什么错误。下一篇将有所改进。

?

?

1 楼 yangguo 2010-08-18  
继续跟进。终于在读完JE上一大片垃圾帖后得以此篇填充饥饿的灵魂。
2 楼 lirong1978 2010-08-19  
楼上讲的话,我真是觉得有点恶心的感觉!
3 楼 CosmosWon 2010-08-20  
有时候IE7,8下 setTimeOut不好用。。。
倒是setInterval在FF,IE都能行。。。
4 楼 guduxing890 2010-08-21  
好贴。。项目中正郁闷这个问题呢。