web-dev-qa-db-ja.com

ブラウザでAJAX（XmlHttpRequest）呼び出しでタイムアウトを検出する方法は？

私はウェブで探していますが、ドキュメントを手に入れるのは難しいです。ブラウザーの組み込み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);のようなことを行うことをお勧めしますか？]

ありがとう！

-マイク

javascriptajaxbrowser
42
Mike

UPDATE：ここに 例 タイムアウトの処理方法があります：

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では、 timeout イベントハンドラーをXMLHttpRequestオブジェクトに追加できます。

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

あなたのコードが示唆するように同期呼び出しを行うことをお勧めしますが、これを行うためにjavascriptフレームワークを使用することもお勧めします。 jQueryは最も人気のあるものです。これにより、コードがより効率的になり、保守が容易になり、ブラウザ間の互換性が確保されます。

51
Jose Basilio

最新のブラウザの一部（2012）は、setTimeoutに依存せずにこれを行います：XMLHttpRequestに含まれています。回答を参照してください https://stackoverflow.com/a/4958782/698168 ：

var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function () {
    if (xhr.readyState == 4) {
        alert("ready state = 4");
    }
};

xhr.open("POST", "http://www.service.org/myService.svc/Method", true);
xhr.setRequestHeader("Content-type", "application/json; charset=utf-8");
xhr.timeout = 4000;
xhr.ontimeout = function () { alert("Timed out!!!"); }
xhr.send(json);
53
Julien Kronegg