Ajax实战(4)：检查超时

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

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

代码如下：

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

02   

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

04   

05 if(timeout>0){

06     setTimeout(function(){

07         isTimeout = true;

08     },timeout);

09 }

10   

11 //最后将isTimeout用在onreadystatechange处理中

12 xhr.onreadystatechange = function(){

13     if (xhr.readyState == 4 && !isTimeout){//当请求完成，且没有超时才处理结果

14         _onStateChange(xhr, type, success, failure);

15     }else{}

16 };

调用如下

1 .text('../servlet/Ajax',{

2     timeout : 2000,

3     success : function(){},

4     failure : function(){}

5 });

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

01 try {

02     Thread.sleep(3000);

03 } catch (InterruptedException e) {

04     e.printStackTrace();

05 }

06 response.setContentType("text/html");

07 PrintWriter out = response.getWriter();

08 out.println("request success");

09 out.flush();

10 out.close();

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