gérer une erreur ajax lorsqu'un utilisateur clique rafraîchir

Question

Je m'excuse si c'est quelque chose que je devrais être en mesure de rechercher. tous les termes que je voulais étaient très surchargés ..

Voici mon problème: quand j'ouvre une page, il déclenche toute une série d'appels ajax. si je puis appuyer sur Shift + Refresh, tous ces appels ajax sont considérés comme des erreurs, et montrant leurs boîtes de dialogue de message d'erreur avant que la page entière se recharge elle-même.

donc l'erreur est déclenchée par le client - y at-il de toute façon je peux savoir si c'est le cas pour que je puisse l'ignorer? par exemple dans le XMLHttpRequest, ou dans la fonction ajax (j'utilise jquery BTW)

Answer 1

[c'est modifié de la réponse précédente, qui avait des questions en suspens que j'ai depuis résolu]

jQuery lance l'événement d'erreur lorsque l'utilisateur quitte la page en rafraichissant, en cliquant sur un lien ou en modifiant l'URL dans le navigateur. Vous pouvez détecter ces types d'erreurs par en mettant en place un gestionnaire d'erreur pour l'appel ajax et inspecter l'objet XMLHttpRequest:

$.ajax({ 
    /* ajax options omitted */ 
    error: function (xmlHttpRequest, textStatus, errorThrown) { 
     if(xmlHttpRequest.readyState == 0 || xmlHttpRequest.status == 0) 
       return; // it's not really an error 
     else 
       // Do normal error handling 
}); 

Answer 2

var isPageBeingRefreshed = false; 

window.onbeforeunload = function() { 
    isPageBeingRefreshed = true; 
}; 

$.ajax({ 
    error: function (xhr, type, errorThrown) { 
     if (!xhr.getAllResponseHeaders()) { 
      xhr.abort(); 
      if (isPageBeingRefreshed) { 
       return; // not an error 
      } 
     } 
    } 
}); 

Answer 3

Les techniques ci-dessus ne fonctionne pas pour une page périodiquement rafraîchissante (par exemple toutes les demi secondes). J'ai compris que l'erreur provoquée par l'actualisation de la page peut être évitée en retardant le processus de gestion des erreurs de quelques minutes.

Exemple:

$.ajax(...) 
.success(...) 
.error(function(jqXHR) { 
setTimeout(function() { 
    // error showing process 
}, 1000); 
}); 

En plus de cela

window.onbeforeunload = function() {// arrêt des appels ajax}

événement

peut être utilisé pour moins fréquemment rafraîchissement des appels ajax.

Answer 4

Il existe plusieurs approches proposées pour détecter ceci:

• Plusieurs ont suggéré l'utilisation d'un gestionnaire beforeunload pour définir un indicateur booléen de telle sorte que le gestionnaire d'erreurs peut savoir que la page est en cours de déchargement (Voir liste des publications liées/dupliquées ci-dessous). C'est génial, sauf que mobile Safari on iOS doesn't support the beforeunload event.

• Sachindra suggested une approche où au lieu de tirer la fonction d'erreur immédiatement, il a été retardé d'une seconde dans un setTimeout(..., 1000). De cette façon, il y a de fortes chances que la page ait réellement disparu au moment où le gestionnaire d'erreur est appelé. "Bonne chance" c'est. Je parie que si j'ai une énorme page avec par exemple Beaucoup de temps, il pourrait prendre plus de 1 sec pour décharger, et peut-être que le gestionnaire d'erreur serait déclencher quand même.

Je propose donc une combinaison de reliably detecting beforeunload support et si beforeunload est pas pris en charge (toux toux iPad/iPhone ) revenir au tour du retard Sachindra.

Voir la solution complète avec beforeunload de détection et tout dans ce jsfiddle.

On dirait que la situation est a little better for jQuery 2.x than for 1.x, mais 2.x semble aussi un peu flakey, et donc je trouve toujours cette suggestion prudente.

P.S: Il y avait aussi des suggestions relatives aux essais des champs dans l'objet XHR/jqXHR. (Here et here). Je ne suis pas tombé sur une combinaison qui pourrait faire la différence entre la navigation de l'utilisateur et le redémarrage du serveur web pendant un appel AJAX de longue durée, et je n'ai donc pas trouvé cette approche utile pour moi.

C'est vraiment aussi une réponse à ces Stack connexes/dupliqués des questions overflow:

• jQuery AJAX fires error callback on window unload?
• $.ajax calls success handler when request fails because of browser reloading
• How best to handle errors during jquery ajax calls caused by user clicking on links
• Detecting that a jQuery.ajax call failed because the page is reloading?

et ces postes en dehors de la pile Débordement:

• What's the proper way to deal with AJAX error because of page reload?
• How to Distinguish a User-Aborted AJAX Call from an Error | I like stuff.

Answer 5

version combinée de nisanth074 et Peter V. Mørch réponses, qui ont travaillé pour moi.

Exemple:

var isPageBeingRefreshed = false; 

$(window).on('beforeunload', function(){ 

    isPageBeingRefreshed = true; 
}); 

$.ajax({ 

    // Standart AJAX settings 

}).error(function(){ 

    if (!isPageBeingRefreshed) { 

     // Displaying error message 
    } 
});