jquery - net - peticion ajax mvc

¿Cómo manejas los errores de las llamadas AJAX?

Question

Digamos que tengo la siguiente llamada jQuery AJAX:

$.ajax({
   type: "POST",
   url: "MyUrl",
   data: "val1=test",
   success: function(result){
        // Do stuff
   }
 });

Ahora, cuando se realiza esta llamada AJAX, quiero que el código del lado del servidor se ejecute a través de unas pocas comprobaciones de manejo de errores (por ejemplo, si el usuario aún está conectado, ¿tiene permiso para usar esta llamada? ¿Son válidos los datos ?, etc.). Si se detecta un error, ¿cómo hago que ese mensaje de error vuelva a aparecer en el lado del cliente?

Mi pensamiento inicial sería devolver un objeto JSON con dos campos: error y errorMessage. Estos campos se verificarán en la llamada jQuery AJAX:

$.ajax({
   type: "POST",
   url: "MyUrl",
   data: "val1=test",
   success: function(result){
       if (result.error == "true") 
       {
           alert("An error occurred: " & result.errorMessage);
       }
       else 
       {
           // Do stuff
       }
   }
 });

Esto me parece un poco torpe, pero funciona. ¿Hay una mejor alternativa?

Answer 1

¿La función jQuery ajax no acepta un parámetro más al final, una devolución de llamada para llamadas fallidas? Si es así, simplemente agregue un fail:function(...){..} después de la exitosa devolución de llamada.

Answer 2

Devuelve un código de error en el lado del servidor utilizando el error de HTTP que mejor se compara con el error. Luego usa la devolución de llamada de error. Esto también le permitirá mostrar los errores dados por su servidor web.

Answer 3

$.ajax({
   type: "POST",
   url: "MyUrl",
   data: "val1=test",
   success: function(result){
        // Do stuff
   },
   error: function(request,status,errorThrown) {
        // There''s been an error, do something with it!
        // Only use status and errorThrown.
        // Chances are request will not have anything in it.
   }
 });

Answer 4

Personalmente, tengo un código similar al siguiente código en mi biblioteca.

$.ajaxSetup({
    error: function(xhr){
        alert(''Request Status: '' + xhr.status + '' Status Text: '' + xhr.statusText + '' '' + xhr.responseText);
    }
});

jQuery docs Ajax / jQuery.ajaxSetup

La mejor forma de pasar ese error desde el lado del servidor (usando php) al lado del cliente es enviar un encabezado a través de la solicitud Ajax en algún lugar de los 400 (que siempre está asociado con errores). Una vez que la solicitud Ajax recibe esto, activará su función de error. Esto también significa que no tiene que definir un error: llame cada llamada a $ .ajax.

header(''HTTP/1.0 419 Custom Error'');

Cita de la información del encabezado w3.org

Error 4xx, 5xx Los códigos 4xx están destinados a casos en los que el cliente parece haber cometido un error, y los códigos 5xx para los casos en que el servidor sabe que el servidor ha cometido un error. Es imposible distinguir estos casos en general, por lo que la diferencia es solo informativa. La sección del cuerpo puede contener un documento que describe el error en forma legible por humanos. El documento está en formato MIME, y solo puede estar en texto / texto simple, texto / html o uno para los formatos especificados como aceptables en la solicitud.

Answer 5

Es bastante tarde para responder esta pregunta, pero creo que será beneficioso para alguien que use es6 y jquery 2.2.

Generalmente sigo esto (enfoque diferido) en mi código

sendAjaxRequest(URL, dataToSend) {
    return $.ajax({
        type        : ''POST'',
        url         : URL,
        data        : JSON.stringify(dataToSend),
        dataType    : ''json''
    }).fail((responseData) => {
        if (responseData.responseCode) {
            console.error(responseData.responseCode);
        }
    });
},

He adjuntado un método de fail diferida que se llamará si se produce algún error. Es una construcción alternativa a la opción de devolución de llamada de error, el método .fail () reemplaza el método obsoleto .error () en el último jquery.

A continuación, desde el lugar de llamada sendAjaxRequest utilizo la devolución de llamada jquery promise

sendAjaxRequest(URL, dataToSend)
.then(
     (success) => {
     },
     (error) => {
     }
);

Llamará función de éxito o error en función de la respuesta recibida del servidor.