如何在浏览器中检测AJAX（XmlHttpRequest）调用的超时？

Question

我正在网上浏览，但是很难获得文档。我们都知道使用浏览器的内置XMLHttpRequest对象进行基本的AJAX调用（此处为现代浏览器）：

var xmlHttp = new XMLHttpRequest();  // Assumes native object

xmlHttp.open("GET", "http://www.example.com", false);

xmlHttp.send("");

var statusCode = xmlHttp.status;
// Process it, and I'd love to know if the request timed out

因此，有没有一种方法可以通过在浏览器中检查XMLHttpRequest对象来检测AJAX调用是否超时？建议我做类似的事情window.setTimeout(function() { xmlHttp.abort() }, 30000);吗？

谢谢！

-麦克风

Answer 1

更新：
这是一个如何处理超时的示例：

var xmlHttp = new XMLHttpRequest();
xmlHttp.open("GET", "http://www.example.com", true);

xmlHttp.onreadystatechange=function(){
   if (xmlHttp.readyState == 4 && xmlHttp.status == 200) {
      clearTimeout(xmlHttpTimeout); 
      alert(xmlHttp.responseText);
   }
}
// Now that we're ready to handle the response, we can make the request
xmlHttp.send("");
// Timeout to abort in 5 seconds
var xmlHttpTimeout=setTimeout(ajaxTimeout,5000);
function ajaxTimeout(){
   xmlHttp.abort();
   alert("Request timed out");
}

在IE8中，您可以向对象添加超时事件处理程序XMLHttpRequest。

var xmlHttp = new XMLHttpRequest();
xmlHttp.ontimeout = function(){
  alert("request timed out");
}

我建议不要像代码所暗示的那样进行同步调用，也建议使用javascript框架来做到这一点。 jQuery
是最受欢迎的一种。它使您的代码更高效，更易于维护并且跨浏览器兼容。