ustawić limit czasu w wywołanie ajax podczas korzystania z podstawowych javascript

Question

Mam funkcję JavaScript, aby wywołać ajax. Teraz muszę dodać czas w tej funkcji, tak jak podczas wywołania usługi zajęło więcej niż czas zbezcześcić wywołanie ajax powinien limit czasu i wyświetlić domyślną wiadomość. Nie chcę używać w tym Jquery.

tutaj jest mój kod:

AJAX = function (url, callback, params) { 
     var dt = new Date(); 
     url = (url.indexOf('?') == -1) ? url + '?_' + dt.getTime() : url + '&_' + dt.getTime(); 
     if (url.indexOf('callback=') == -1) { 
      ajaxCallBack(url, function() { 
       if (this.readyState == 4 && this.status == 200) { 
        if (callback) { 
         if (params) { 
          callback(this.responseText, params); 
         } else { 
          callback(this.responseText); 
         } 
        } 
       } 
      }); 
     } else { 
      var NewScript = d.createElement("script"); 
      NewScript.type = "text/javascript"; 
      NewScript.src = url + '&_' + Math.random(); 
      d.getElementsByTagName('head')[0].appendChild(NewScript); 
     } 
    }, 
    ajaxCallBack = function (url, callback) { 
     var xmlhttp; 
     if (window.XMLHttpRequest) { 
      xmlhttp = new XMLHttpRequest(); 
     } else { 
      xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); 
     } 
     xmlhttp.onreadystatechange = callback; 
     xmlhttp.open("GET", url, true); 
     xmlhttp.send(); 
    } 

Answer 1

Oto example jaki sposób można obsłużyć timeout:

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"); 
} 

w IE8, można dodać obsługi zdarzenia limitu czasu do obiektu XMLHttpRequest.

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

Użyj ram javascript, aby to zrobić, ale nie wiem, dlaczego go nie używasz, czy podoba Ci się niezobowiązująca praca? :)

Answer 2

Może pomoże ci odpowiedź na to pytanie. Timeout XMLHttpRequest

ponieważ z tego co rozumiem trzeba ustawić limit czasu dla XMLHttpRequest, można użyć xmlhttp.timeout = /*some number*/

Answer 3

Jeśli chcesz po prostu dodać limitu czasu, możesz dodać go do pierwszej funkcji w trzech miejscach:

 setTimeout(function() {callback(this.responseText, params)}, 1000) 

A twoje wywołanie zwrotne zostanie wykonane około 1 sekundy później. Drugie miejsce to drugie wywołanie zwrotne.

trzecie miejsce, które chciałbym zasugerować jest owinąć tę funkcję jak powyżej:

 ajaxCallBack(url, function() { 
      if (this.readyState == 4 && this.status == 200) { 
       if (callback) { 
        if (params) { 
         callback(this.responseText, params); 
        } else { 
         callback(this.responseText); 
        } 
       } 
      } 
     }); 

Zwykle, gdy ja dostać się do testowania połączenia internetowego i raczej dodać dławienie w narzędziach chrom deweloperskich tak:

Oto kod z pierwszego podejścia:

 AJAX = function (url, callback, params) { 
       var dt = new Date(); 
       url = (url.indexOf('?') == -1) ? url + '?_' + dt.getTime() : url + '&_' + dt.getTime(); 
       if (url.indexOf('callback=') == -1) { 
        ajaxCallBack(url, function() { 
         if (this.readyState == 4 && this.status == 200) { 
          if (callback) { 
           if (params) { 
            console.log(new Date()); 
            setTimeout(function() {callback(this.responseText, params)}, 2000); 
           } else { 
            console.error((new Date()).getSeconds()); 
            setTimeout(function() {callback(this.responseText)}, 2000); 
           } 
          } 
         } 
        }); 
       } else { 
        var NewScript = d.createElement("script"); 
        NewScript.type = "text/javascript"; 
        NewScript.src = url + '&_' + Math.random(); 
        d.getElementsByTagName('head')[0].appendChild(NewScript); 
       } 
      }, 
     ajaxCallBack = function (url, callback) { 
       var xmlhttp; 
       if (window.XMLHttpRequest) { 
        xmlhttp = new XMLHttpRequest(); 
       } else { 
        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); 
       } 
       xmlhttp.onreadystatechange = callback; 
       xmlhttp.open("GET", url, true); 
       xmlhttp.send(); 
     } 

     AJAX('http://ip.jsontest.com/', function() {console.error((new Date()).getSeconds()); });