2009-06-19 19 views
40

私はウェブ上を見ていますが、ドキュメントは手に入りにくいです。我々は、すべての(ここでは近代的なブラウザを想定)を内蔵していますXMLHttpRequestオブジェクトブラウザを使用して、基本的なAJAX呼び出しを知っている:ブラウザのAJAX(XmlHttpRequest)コールでタイムアウトを検出するにはどうすればよいですか?

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);のようなことをするように勧められますか?

ありがとうございます!

答えて

48

UPDATE -Mike:はここでは、タイムアウトを扱うことができる方法のan exampleです:

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オブジェクトにtimeoutイベントハンドラを追加することができます。

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

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

47

近代的なブラウザ(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); 
+9

2014年に、この回答は正しいものとしてタグ付けされる必要があります。今日では、ほとんどすべてのブラウザがこれをサポートしています(IE8以降)。 –

+3

まあまあ、ontimeoutイベントがAFTER readyState == 4がトリガーされるまで起動されないという警告はありません。これは非直感的であるだけでなく、タイムアウトがあったためにアップロードが成功しなかったかどうかに基づいて条件付きの動作を作成することを困難にします。たとえば、アップロードが失敗した理由に関するユーザーアラートをカスタマイズします。私の状況では、私はsetTimeoutで欲しいものを達成することしかできないことがわかった。また、xhr.timeoutは2016年のSafariでは動作しないようです。 – Allasso

関連する問題