上一篇只是检查是否超时,超时后却不做任何处理。这里如果超时,会给failure第二个参数msg赋值为“request timeout”。
?
这样使用者能清楚的知道一次HTTP请求的细节。实现细节较为诡异,得慢慢体会。这里timeout的效果和JQuery,Ext是一样的。如下
?
Ajax.text('../servlet/Ajax',{
timeout : 2000,
success : function(result){},
failure : function(xhr,msg){
alert(msg);
}
});
?
?
源码见附件
1 楼
hardPass
2010-08-19
一口气跟读下来,虽然没有仔细测试代码,但也算是相当认真看了。
这段代码,从上一帖看就觉得有问题。
这一帖还是没变。
只要是超时了,就不会执行_onStateChange,也就不会执行超时的处理啦
xhr.onreadystatechange = function(){
if (xhr.readyState == 4 && !isTimeout){
_onStateChange(xhr, type, success, failure);
clearTimeout(timer);
}else{}
};这段代码,从上一帖看就觉得有问题。
这一帖还是没变。
只要是超时了,就不会执行_onStateChange,也就不会执行超时的处理啦
2 楼
zhouyrt
2010-08-19
hardPass 写道
一口气跟读下来,虽然没有仔细测试代码,但也算是相当认真看了。
这段代码,从上一帖看就觉得有问题。
这一帖还是没变。
只要是超时了,就不会执行_onStateChange,也就不会执行超时的处理啦
xhr.onreadystatechange = function(){
if (xhr.readyState == 4 && !isTimeout){
_onStateChange(xhr, type, success, failure);
clearTimeout(timer);
}else{}
};这段代码,从上一帖看就觉得有问题。
这一帖还是没变。
只要是超时了,就不会执行_onStateChange,也就不会执行超时的处理啦
hardPass,谢谢您的提醒。看的很仔细。
这段代码没有问题的,你可以测试下超时的情况。这段代码比较容易误解。博客中没有写出来实现细节,因为太诡异了,初看起来不会执行,实际却执行了。
这篇与上篇的区别是超时后调用了xhr的abort方法,调用abort后status为0,在为0的判断中调用failure,这是最关键的。
试下就知...
3 楼
hardPass
2010-08-19
特地测试了下,果然执行啦!
isTimeout = true;是在abort()后执行的。
一直以为abort()后,XMLHttpRequest.readyState 会被复位为0;
现在看来,其中还做了很多事情啊。
关键是XMLHttpRequest.abort()里干了些啥事情?
根据上面打印的东西,差不多猜测 XMLHttpRequest.abort()里干了这些内容:
1、先将XMLHttpRequest.readyState 直接置为4
2、触发XMLHttpRequest.onreadystatechange 事件
3、最好才将XMLHttpRequest.readyState 置为0
isTimeout = true;是在abort()后执行的。
一直以为abort()后,XMLHttpRequest.readyState 会被复位为0;
现在看来,其中还做了很多事情啊。
if(timeout>0){
timer = setTimeout(function(){
document.write("\n<br>before abort " + xhr.readyState + isTimeout);
xhr.abort();
document.write("\n<br>after abort " + xhr.readyState + isTimeout);
isTimeout = true;
},timeout);
}
xhr.onreadystatechange = function(){
document.write("\n<br>onreadystatechange " + xhr.readyState + isTimeout);
if (xhr.readyState == 4 && !isTimeout){
_onStateChange(xhr, type, success, failure);
clearTimeout(timer);
}else{}
};
before abort 1false
onreadystatechange 4false
after abort 0false
关键是XMLHttpRequest.abort()里干了些啥事情?
根据上面打印的东西,差不多猜测 XMLHttpRequest.abort()里干了这些内容:
1、先将XMLHttpRequest.readyState 直接置为4
2、触发XMLHttpRequest.onreadystatechange 事件
3、最好才将XMLHttpRequest.readyState 置为0
4 楼
hardPass
2010-08-19
也不对,上面的情况在ie下运行的结果。
在firefox下,没有报timeout
在Chrom下,运行也稍微有不同
在firefox下,没有报timeout
在Chrom下,运行也稍微有不同
5 楼
yudylaw
2010-08-20
Ajax 超时 IE 支持。FireFox 不支持吧。
6 楼
rainsilence
2010-08-21
FireFox 下,调用abort,在onreadystatechange中,readyState == 4 会执行两遍。。。而httpstatus永远为0。
7 楼
rainsilence
2010-08-21
虽然,abort方法执行后会执行onreadystatechange句柄,但是由于浏览器不同,执行次数,readyState,都会不同
因此,直接对onreadystatechange句柄进行控制是很危险的。
lz的代码因为没有提供ontimeout句柄,所以代码勉强能用
因此,直接对onreadystatechange句柄进行控制是很危险的。
lz的代码因为没有提供ontimeout句柄,所以代码勉强能用
8 楼
rainsilence
2010-08-22
仔细看了下jquery的超时处理
其实很简单,并没有连发几个帖子的必要
假设定义了一个ontimeout句柄
在framework的某个地方定义了触发事件函数dispatchEvent
然后XMLHttpRequest定义为
var xmlHttp = .....
最后超时处理
其实很简单,并没有连发几个帖子的必要
假设定义了一个ontimeout句柄
var ontimeout = function() {.....}在framework的某个地方定义了触发事件函数dispatchEvent
然后XMLHttpRequest定义为
var xmlHttp = .....
最后超时处理
setTimeout(function() {
// 调用timeout句柄
dispatchEvent("timeout");
// 消除浏览器差异
var onreadystatechange = xmlHttp.onreadystatechange;
xmlHttp.onreadystatechange = function() {};
try {
var oldAbort = xmlHttp.abort();
xmlHttp.abort = function() {
oldAbort.call(xmlHttp);
xmlHttp.readyState = 0;
};
} catch(e) {}
xmlHttp.abort();
// 如果xmlHttp需要第二次提交的话,需要以下这句,否则不需要
xmlHttp.onreadystatechange = onreadystatechange;
}, 超时时间);
9 楼
kimmking
2010-08-22
rainsilence 写道
仔细看了下jquery的超时处理
其实很简单,并没有连发几个帖子的必要
假设定义了一个ontimeout句柄
在framework的某个地方定义了触发事件函数dispatchEvent
然后XMLHttpRequest定义为
var xmlHttp = .....
最后超时处理
其实很简单,并没有连发几个帖子的必要
假设定义了一个ontimeout句柄
var ontimeout = function() {.....}在framework的某个地方定义了触发事件函数dispatchEvent
然后XMLHttpRequest定义为
var xmlHttp = .....
最后超时处理
setTimeout(function() {
// 调用timeout句柄
dispatchEvent("timeout");
// 消除浏览器差异
var onreadystatechange = xmlHttp.onreadystatechange;
xmlHttp.onreadystatechange = function() {};
try {
var oldAbort = xmlHttp.abort();
xmlHttp.abort = function() {
oldAbort.call(xmlHttp);
xmlHttp.readyState = 0;
};
} catch(e) {}
xmlHttp.abort();
// 如果xmlHttp需要第二次提交的话,需要以下这句,否则不需要
xmlHttp.onreadystatechange = onreadystatechange;
}, 超时时间);你说对了。
lz就是为了刷分的。
10 楼
wangweiwei358
2010-09-24
楼主,问你个问题哦。
请问下,isTimeout这个变量如果去掉呢?对运行有影响吗?
谢谢你能回复。
请问下,isTimeout这个变量如果去掉呢?对运行有影响吗?
谢谢你能回复。
11 楼
zhouyrt
2010-09-24
wangweiwei358 写道
楼主,问你个问题哦。
请问下,isTimeout这个变量如果去掉呢?对运行有影响吗?
谢谢你能回复。
请问下,isTimeout这个变量如果去掉呢?对运行有影响吗?
谢谢你能回复。
没有影响,它可选参数。
12 楼
yangguo
2010-12-22
kimmking 写道
rainsilence 写道
仔细看了下jquery的超时处理
其实很简单,并没有连发几个帖子的必要
假设定义了一个ontimeout句柄
在framework的某个地方定义了触发事件函数dispatchEvent
然后XMLHttpRequest定义为
var xmlHttp = .....
最后超时处理
其实很简单,并没有连发几个帖子的必要
假设定义了一个ontimeout句柄
var ontimeout = function() {.....}在framework的某个地方定义了触发事件函数dispatchEvent
然后XMLHttpRequest定义为
var xmlHttp = .....
最后超时处理
setTimeout(function() {
// 调用timeout句柄
dispatchEvent("timeout");
// 消除浏览器差异
var onreadystatechange = xmlHttp.onreadystatechange;
xmlHttp.onreadystatechange = function() {};
try {
var oldAbort = xmlHttp.abort();
xmlHttp.abort = function() {
oldAbort.call(xmlHttp);
xmlHttp.readyState = 0;
};
} catch(e) {}
xmlHttp.abort();
// 如果xmlHttp需要第二次提交的话,需要以下这句,否则不需要
xmlHttp.onreadystatechange = onreadystatechange;
}, 超时时间);你说对了。
lz就是为了刷分的。
谈到刷分,好像没人能超越你。