manejar ajax de error cuando un usuario hace clic en actualizar

me disculpo si esto es algo que debe ser capaz de mirar hacia arriba. todos los términos que yo quería eran sobrecargado..

aquí está mi problema: cuando abro una página, se desencadena toda una serie de llamadas ajax. si yo, a continuación, presione Shift+Actualizar, todas esas llamadas ajax se consideran los errores, y mostrando sus cuadros de diálogo de mensaje de error antes de que toda la página se vuelve a cargar.

por lo que el error es activada por el cliente es de todos modos puedo averiguar si este es el caso, así que puede pasar por alto? por ejemplo, en el xmlhttprequest, o en la función de ajax (estoy utilizando jquery btw)

  • Usted está poniendo el código en el interior de un jQuery onLoad annonymous función de la derecha? Como, al principio de tu código: $(function() { /* hacer todas sus llamadas ajax aquí */ }); Usted debe esperar hasta que el DOM esté cargado antes de hacer llamadas ajax.
InformationsquelleAutor gcrain | 2009-03-31

5 Kommentare

  1. 19

    [esta es una edición de la respuesta anterior, que había cuestiones pendientes que tengo ya resuelto]

    jQuery lanza el evento de error cuando el usuario abandone la página, ya sea mediante la actualización, haga clic en un vínculo, o cambiar la dirección URL en el navegador. Usted puede detectar estos tipos de errores mediante la implementación de un controlador de errores de la llamada ajax, y de inspeccionar el objeto 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
    });
    • Este parece que no funciona como se anuncia. Cuando puedo presentar a un «error real» mediante la desactivación de mi conexión de red durante un largo encuesta, también veo readyState == 0 y estado == 0.
    • Esto no funciona. Este método deja de detectar los errores reales demasiado
    • Reiniciar el servidor web en el centro de una larga encuesta también los rendimientos readyState == 0 && status == 0. Este método no es fiable.
    • No funciona en Firefox. Obtengo el error 404 código de error y readyState tiene un valor de 4
  2. 37

    Hay varios enfoques sugeridos para la detección de este:

    • Varios han sugerido que el uso de un beforeunload controlador para establecer un indicador booleano para que el controlador de errores puede saber que la página se descarga (Véase la lista de relacionados con duplicar los puestos de abajo). Esto es genial, excepto que mobile Safari en iOS no es compatible con el beforeunload evento.

    • Sachindra sugerido un enfoque en el que en lugar de disparar la función de error de inmediato, tuvo un retraso de un segundo en un setTimeout(..., 1000). De esa manera, hay una buena probabilidad de que la página en realidad ha desaparecido por el momento en que el controlador de errores que se llama. «Buena oportunidad» que es. Yo apuesto a que si tengo una gran página con, por ejemplo, muchos <input>s, podría tomar más de 1 segundo para descargar y, a continuación, tal vez el controlador de error podría fuego de todos modos.

    Por lo tanto, sugiero una combinación de fiable de detección de beforeunload apoyo y si beforeunload no es compatible (tos iPad/iPhone tos) volver a Sachindra la demora del truco.

    Ver la solución completa con beforeunload detección y todos en este jsfiddle.

    Parece que la situación es un poco mejor para jQuery 2.x que para 1.x, pero 2.x también me parece un poco flakey, y así creo que esta sugerencia prudente.

    P. S: también hubo sugerencias que implican las pruebas de algunos de los campos en la XHR /jqXHR objeto. (Aquí y aquí). Yo no he venido a través de una combinación que podría distinguir entre la navegación del usuario y reiniciar el servidor web durante un largo llamada AJAX, y yo por lo tanto no han encontrado este enfoque útil para mí.

    Esto realmente es también una respuesta a estas duplicar Desbordamiento de la Pila de preguntas:

    y que estos puestos fuera de Desbordamiento de Pila:

    • En abril de 2017, este problema se produce sólo en Firefox, que es compatible con beforeunload.
  3. 6
    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
                }
            }
        }
    });
    • Esta casi, trabajó para mí. Trabajó en Firefox, Chrome, IE8, IE10 y en Android stock del navegador. Pero no en iOS Safari. Una mejora de la sugerencia (que aún no funciona en Safari/iOS) sería el uso de $(window).on('beforeunload', function () {...}) en lugar de window.beforeunload = function () {...} para no secuestrar/hog el beforeunload controlador. Todavía en busca de algo que también funciona en iOS Safari también.
  4. 2

    Las técnicas anteriores no funciona para los periódicos de un refrescante página (por ejemplo cada media segundos). Me he dado cuenta de que el error causado por la actualización de la página se puede evitar el uso de retrasar el error de manipulación del proceso por una pequeña cantidad de tiempo.

    Ejemplo:

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

    Además de que

    ventana.onbeforeunload = function() {//para detener las llamadas ajax}

    evento puede ser utilizado para menos frecuentemente refrescante de las llamadas ajax.

  5. 2

    Versión combinada de nisanth074 y Peter V. Mørch respuestas, que trabajó para mí.

    Ejemplo:

    var isPageBeingRefreshed = false;
    
    $(window).on('beforeunload', function(){
    
        isPageBeingRefreshed = true;
    });
    
    $.ajax({
    
        //Standart AJAX settings
    
    }).error(function(){
    
        if (!isPageBeingRefreshed) {
    
            //Displaying error message
        }
    });

Kommentieren Sie den Artikel

Bitte geben Sie Ihren Kommentar ein!
Bitte geben Sie hier Ihren Namen ein

Pruebas en línea