Définir le délai d'attente pour ajax (jQuery)

Question

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

Parfois, la fonction success fonctionne bien, parfois non.

Comment définir le délai d'expiration pour cette demande ajax? Dans l'exemple, 3 secondes, si le temps est écoulé, affichez une erreur.

Le problème est que la requête ajax gèle le bloc jusqu'à la fin. Si le serveur est arrêté pendant un certain temps, il ne finira jamais.

Answer 1

S'il vous plaît lire le $.ajax la documentation , c'est un sujet couvert.

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

Vous pouvez voir quel type d'erreur a été généré en accédant au paramètre textStatus de l'option error: function(jqXHR, textStatus, errorThrown) . Les options sont "timeout", "error", "abort" et "parsererror".

Answer 2

Voici quelques exemples qui démontrent définition et détection de l'expiration des délais pour jQuery d'anciens et de nouveaux paradigmes.

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?
    }
});​

Démonstration En Direct

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

Notez que le textStatus param (ou jqXHR.statusText) qui vous permettra de savoir ce que l'erreur a été. Cela peut être utile si vous voulez savoir que le problème a été causé par un délai d'attente.

erreur(jqXHR, textStatus, errorThrown)

Une fonction est appelée si l' demande échoue. La fonction reçoit trois arguments: Le jqXHR (en jQuery 1.4.x, XMLHttpRequest) objet, une chaîne de caractères décrivant le type de erreur qui s'est produite et en option un objet d'exception, si l'on s'est produite. Les valeurs possibles pour le deuxième argument (d'ailleurs null) sont "timeout", "erreur", "abandon", et "parsererror". Quand un HTTP erreur se produit, errorThrown reçoit le texte du statut HTTP, tels que "Non Trouvé" ou "Erreur Interne du Serveur." Comme de jQuery 1.5, l'erreur le réglage peut accepter un tableau de fonctions. Chaque fonction sera appelée à tour de rôle. Remarque: Cette fonction n'est pas appelée pour la croix-domaine de script et JSONP demandes.

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

Answer 3

Vous pouvez utiliser le paramètre timeout dans les options ajax comme ceci:

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

Lisez tout sur les options ajax ici: http://api.jquery.com/jQuery.ajax/

N'oubliez pas que lorsqu'un délai d'expiration survient, le gestionnaire error est déclenché et non le gestionnaire success :)

Answer 4

utilisez la fonction complète jQuery .ajax . comparez avec http://stackoverflow.com/a/3543713/1689451 pour un exemple.

sans test, il suffit de fusionner votre code avec la question SO référencée:

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

Answer 5

Eh bien, vous pouvez utiliser la fonction native ajax comme:

  $.ajax({
  url: "urlToGo",
  data: whatTosend,
  success: function( receivedData ){
   setTimeOut( 'actionFunction', 2000 );
  }
 });
 

paramètre est en millisecondes!

ou vous pouvez utiliser: setInterval (functionToCall, 1000);