Time-out instellen voor ajax (jQuery)

Soms werkt de success-functie goed, soms niet.

Hoe stel ik een time-out in voor dit ajax-verzoek? Bijvoorbeeld, 3 seconden, als de tijd voorbij is, laat dan een fout zien.

Het probleem is dat het ajax-verzoek het blok bevriest totdat het klaar is. Als de server een tijdje niet beschikbaar is, zal deze nooit eindigen.

Antwoord 1, autoriteit 100%

Lees de $.ajaxdocumentatie, dit is een behandeld onderwerp.

$.ajax({
    url: "test.html",
    error: function(){
        // will fire when timeout is reached
    },
    success: function(){
        //do something
    },
    timeout: 3000 // sets timeout to 3 seconds
});

Je kunt zien welk type fout is opgetreden door de parameter textStatus van de optie error: function(jqXHR, textStatus, errorThrown)te openen. De opties zijn “time-out”, “error”, “abort” en “parsererror”.

Antwoord 2, autoriteit 33%

Hier zijn enkele voorbeelden die het instellen en detecteren van time-outs in de oude en nieuwe paradigma’s van jQuery demonstreren.

Live-demo

Beloof het met jQuery 1.8+

Promise.resolve(
  $.ajax({
    url: '/getData',
    timeout:3000 //3 second timeout
  })
).then(function(){
  //do something
}).catch(function(e) {
  if(e.statusText == 'timeout')
  {     
    alert('Native Promise: Failed from timeout'); 
    //do something. Try again perhaps?
  }
});

jQuery 1.8+

$.ajax({
    url: '/getData',
    timeout:3000 //3 second timeout
}).done(function(){
    //do something
}).fail(function(jqXHR, textStatus){
    if(textStatus === 'timeout')
    {     
        alert('Failed from timeout'); 
        //do something. Try again perhaps?
    }
});​

jQuery <= 1.7.2

$.ajax({
    url: '/getData',
    error: function(jqXHR, textStatus){
        if(textStatus === 'timeout')
        {     
             alert('Failed from timeout');         
            //do something. Try again perhaps?
        }
    },
    success: function(){
        //do something
    },
    timeout:3000 //3 second timeout
});

Merk op dat de parameter textStatus(of jqXHR.statusText) u zal laten weten wat de fout was. Dit kan handig zijn als u wilt weten of de storing is veroorzaakt door een time-out.

error(jqXHR, textStatus, errorThrown)

Een functie die moet worden aangeroepen als de
aanvraag mislukt. De functie krijgt drie argumenten: De jqXHR (in
jQuery 1.4.x, XMLHttpRequest) object, een tekenreeks die het type van . beschrijft
fout die is opgetreden en een optioneel uitzonderingsobject, als er een is opgetreden.
Mogelijke waarden voor het tweede argument (naast null) zijn “time-out”,
“fout”, “afbreken” en “parsererror”. Wanneer een HTTP-fout optreedt,
errorThrown ontvangt het tekstgedeelte van de HTTP-status, zoals:
“Niet gevonden” of “Interne serverfout”. Vanaf jQuery 1.5 is de fout
instelling kan een reeks functies accepteren. Elke functie wordt aangeroepen
beurtelings. Opmerking: deze handler wordt niet aangeroepen voor cross-domain script en
JSONP-verzoeken.

src: http://api.jquery.com/jQuery.ajax/

Antwoord 3, autoriteit 7%

U kunt de instelling timeoutin de ajax-opties als volgt gebruiken:

$.ajax({
    url: "test.html",
    timeout: 3000,
    error: function(){
        //do something
    },
    success: function(){
        //do something
    }
});

Lees hier alles over de ajax-opties: http://api.jquery.com/jQuery.ajax /

Onthoud dat wanneer een time-out optreedt, de error-handler wordt geactiveerd en niet de success-handler 🙂

Antwoord 4

gebruik de volledige .ajaxjQuery-functie.
vergelijk met https://stackoverflow.com/a/3543713/1689451voor een voorbeeld.

zonder te testen, voeg gewoon uw code samen met de SO-vraag waarnaar wordt verwezen:

target = $(this).attr('data-target');
$.ajax({
    url: $(this).attr('href'),
    type: "GET",
    timeout: 2000,
    success: function(response) { $(target).modal({
        show: true
    }); },
    error: function(x, t, m) {
        if(t==="timeout") {
            alert("got timeout");
        } else {
            alert(t);
        }
    }
});​

Antwoord 5

Vergeet niet de NginX-instellingen te controleren, ook als uw verzoeken via NginX gaan.

Ajax options.timeoutis één ding, maar de time-out voor nginx-verzoeken moet mogelijk ook worden aangepast.

Zie https://ubiq.co/tech-blog/increase -request-timeout-nginx/