Question

我正在使用XMLHttpRequest来发出异步GET请求。我有

xhr.onreadystatechange = function () {
    if (xhr.readyState === 4) {//Handle only if the state has completed
        if (xhr.status === 200) {
            successHandler.call(context, xhr.responseText);
        } else {
            console.warn('onreadystatechange:' + new Date().getTime());
            failureHandler.call(context, xhr.status, xhr.statusText);
        }
    }
};
xhr.ontimeout = function () {
    console.warn('ontimeout: ' + new Date().getTime());
    failureHandler.call(context, 0, 'timeout');
};

我正在使用网络限制强制超时。我观察到onreadystatechange和ontimeout回调都会在超时的情况下被调用，onreadystatechange在ontimeout之前。我的印象是两人中只有一人会被处决。我正在使用Chrome。有人知道这是否是预期的吗？

Answer 1

现代的解决方案是使用适当的XMLHttpRequest事件：onload和onerror如果你想分别处理这些情况，onloadend如果你希望检测HTTP请求完成而不管成功，ontimeout是否超时。发生超时时，会调用ontimeout，但不会调用onloadend。 onreadystatechange看起来最好留下来悄然死去。可在此处找到完整的事件集：

http://www.w3.org/TR/XMLHttpRequest/#events

由于onreadystatechange→ontimeout序列似乎不会影响IE 8，为了我的目的，我很高兴做到以下几点：在IE 8中使用onreadystatechange，在Firefox /现代MSIE中使用onloadend（使用在测试之后查看事件是否已定义：if（＆＃34; onloadend＆＃34;在httpObj中）...）。

这是一个内部系统，所以这对我来说足够了;对于OP，可能需要进行更多测试。

Answer 2

在 ontimeout 之前调用

onreadystatechange ，要解决此问题，我使用了 setTimeout 和一些表示 ontimeout 的东西。被称为，我决定是这样的：

xhr.onreadystatechange = function (){
    if (xhr.status == 0){
        return setTimeout(()=>{
           if (xhr['istimeout']) return

           onResponse({status:xhr.status, statusText:xhr.statusText})
        }, 1)
    }
}

xhr.ontimeout = function handleTimeout() {
     xhr['istimeout'] = true
     onResponse({
         status: xhr.status,
         statusText: `timeout of xxxms exceeded`,
     })
}

XMLHttpRequest超时情况 - onreadystatechange在ontimeout之前执行？

2 个答案: