Manejo de errores jQuery Ajax, muestra mensajes de excepción personalizados

¿Hay alguna forma en que pueda mostrar mensajes de excepción personalizados como una alerta en mi mensaje de error jQuery AJAX?

Por ejemplo, si deseo lanzar una excepción en el lado del servidor a través de Struts, throw new ApplicationException("User name already exists"); , Quiero ver este mensaje (‘el nombre de usuario ya existe’) en el mensaje de error jQuery AJAX.

 jQuery("#save").click(function () { if (jQuery('#form').jVal()) { jQuery.ajax({ type: "POST", url: "saveuser.do", dataType: "html", data: "userId=" + encodeURIComponent(trim(document.forms[0].userId.value)), success: function (response) { jQuery("#usergrid").trigger("reloadGrid"); clear(); alert("Details saved successfully!!!"); }, error: function (xhr, ajaxOptions, thrownError) { alert(xhr.status); alert(thrownError); } }); } }); 

En la segunda alerta, donde notifico el error arrojado, me estoy volviendo undefined y el código de estado es 500.

No estoy seguro de dónde me estoy equivocando. ¿Qué puedo hacer para solucionar este problema?

Asegúrese de que está configurando Response.StatusCode en algo distinto de 200. Escriba el mensaje de su excepción mediante Response.Write , luego use …

 xhr.responseText 

..en tu javascript.

Controlador:

 public class ClientErrorHandler : FilterAttribute, IExceptionFilter { public void OnException(ExceptionContext filterContext) { var response = filterContext.RequestContext.HttpContext.Response; response.Write(filterContext.Exception.Message); response.ContentType = MediaTypeNames.Text.Plain; filterContext.ExceptionHandled = true; } } [ClientErrorHandler] public class SomeController : Controller { [HttpPost] public ActionResult SomeAction() { throw new Exception("Error message"); } } 

Ver guión:

 $.ajax({ type: "post", url: "/SomeController/SomeAction", success: function (data, text) { //... }, error: function (request, status, error) { alert(request.responseText); } }); 

Lado del servidor:

  doPost(HttpServletRequest request, HttpServletResponse response){ try{ //logic }catch(ApplicationException exception){ response.setStatus(400); response.getWriter().write(exception.getMessage()); //just added semicolon to end of line } } 

Lado del cliente:

  jQuery.ajax({// just showing error property error: function(jqXHR,error, errorThrown) { if(jqXHR.status&&jqXHR.status==400){ alert(jqXHR.responseText); }else{ alert("Something went wrong"); } } }); 

Manejo genérico de errores Ajax

Si necesito hacer algún manejo genérico de errores para todas las solicitudes ajax. Estableceré el controlador ajaxError y mostraré el error en un div denominado errorcontainer en la parte superior del contenido html.

 $("div#errorcontainer") .ajaxError( function(e, x, settings, exception) { var message; var statusErrorMap = { '400' : "Server understood the request, but request content was invalid.", '401' : "Unauthorized access.", '403' : "Forbidden resource can't be accessed.", '500' : "Internal server error.", '503' : "Service unavailable." }; if (x.status) { message =statusErrorMap[x.status]; if(!message){ message="Unknown Error \n."; } }else if(exception=='parsererror'){ message="Error.\nParsing JSON Request failed."; }else if(exception=='timeout'){ message="Request Time out."; }else if(exception=='abort'){ message="Request was aborted by the server"; }else { message="Unknown Error \n."; } $(this).css("display","inline"); $(this).html(message); }); 

Necesita convertir el texto de responseText a JSON. Usando JQuery:

 jsonValue = jQuery.parseJSON( jqXHR.responseText ); console.log(jsonValue.Message); 

Si realiza una llamada a asp.net, esto devolverá el título del mensaje de error:

No escribí todo el formatoErrorMessage, pero me parece muy útil.

 function formatErrorMessage(jqXHR, exception) { if (jqXHR.status === 0) { return ('Not connected.\nPlease verify your network connection.'); } else if (jqXHR.status == 404) { return ('The requested page not found. [404]'); } else if (jqXHR.status == 500) { return ('Internal Server Error [500].'); } else if (exception === 'parsererror') { return ('Requested JSON parse failed.'); } else if (exception === 'timeout') { return ('Time out error.'); } else if (exception === 'abort') { return ('Ajax request aborted.'); } else { return ('Uncaught Error.\n' + jqXHR.responseText); } } var jqxhr = $.post(addresshere, function() { alert("success"); }) .done(function() { alert("second success"); }) .fail(function(xhr, err) { var responseTitle= $(xhr.responseText).filter('title').get(0); alert($(responseTitle).text() + "\n" + formatErrorMessage(xhr, err) ); }) 

Esto es lo que hice y funciona hasta ahora en una aplicación MVC 5.

El tipo de devolución del controlador es ContentResult.

 public ContentResult DoSomething() { if(somethingIsTrue) { Response.StatusCode = 500 //Anything other than 2XX HTTP status codes should work Response.Write("My Message"); return new ContentResult(); } //Do something in here// string json = "whatever json goes here"; return new ContentResult{Content = json, ContentType = "application/json"}; } 

Y en el lado del cliente, así es como se ve la función ajax

 $.ajax({ type: "POST", url: URL, data: DATA, dataType: "json", success: function (json) { //Do something with the returned json object. }, error: function (xhr, status, errorThrown) { //Here the status code can be retrieved like; xhr.status; //The message added to Response object in Controller can be retrieved as following. xhr.responseText; } }); 

Si alguien está aquí como en 2016 para la respuesta, use .fail() para el manejo de errores ya que .error() está en desuso a partir de jQuery 3.0

 $.ajax( "example.php" ) .done(function() { alert( "success" ); }) .fail(function(jqXHR, textStatus, errorThrown) { //handle error here }) 

Espero que ayude

Me pareció agradable porque podía analizar el mensaje que estaba enviando desde el servidor y mostrar un mensaje amigable al usuario sin stacktrace …

 error: function (response) { var r = jQuery.parseJSON(response.responseText); alert("Message: " + r.Message); alert("StackTrace: " + r.StackTrace); alert("ExceptionType: " + r.ExceptionType); } 

Una solución general / reutilizable

Esta respuesta se proporciona para referencia futura a todos aquellos que se encuentran con este problema. La solución consiste en dos cosas:

  1. Excepción personalizada ModelStateException que se lanza cuando la validación falla en el servidor (el estado del modelo informa errores de validación cuando utilizamos anotaciones de datos y utilizamos parámetros de acción de controlador fuertemente tipados)
  2. Filtro de error de acción del controlador personalizado HandleModelStateExceptionAttribute que capta la excepción personalizada y devuelve el estado de error de HTTP con el error de estado del modelo en el cuerpo

Esto proporciona la infraestructura óptima para que las llamadas de jQuery Ajax aprovechen todo su potencial con controladores de error y success .

Código del lado del cliente

 $.ajax({ type: "POST", url: "some/url", success: function(data, status, xhr) { // handle success }, error: function(xhr, status, error) { // handle error } }); 

Código del lado del servidor

 [HandleModelStateException] public ActionResult Create(User user) { if (!this.ModelState.IsValid) { throw new ModelStateException(this.ModelState); } // create new user because validation was successful } 

Todo el problema se detalla en esta publicación de blog donde puedes encontrar todo el código para ejecutar esto en tu aplicación.

Esto es probablemente causado por los nombres de campo JSON que no tienen comillas.

Cambie la estructura JSON de:

 {welcome:"Welcome"} 

a:

 {"welcome":"Welcome"} 

Creo que el controlador de respuesta Ajax usa el código de estado HTTP para verificar si hubo un error.

Por lo tanto, si solo arroja una excepción de Java en su código del lado del servidor pero luego la respuesta HTTP no tiene un código de estado de 500, jQuery (o en este caso probablemente el objeto XMLHttpRequest ) supondrá que todo estuvo bien.

Lo digo porque tenía un problema similar en ASP.NET en el que estaba lanzando algo así como una ArgumentException (“No sé qué hacer …”) pero el controlador de errores no se activaba.

Luego configuré Response.StatusCode en 500 o 200, ya sea que tuve un error o no.

jQuery.parseJSON es útil para el éxito y el error.

 $.ajax({ url: "controller/action", type: 'POST', success: function (data, textStatus, jqXHR) { var obj = jQuery.parseJSON(jqXHR.responseText); notify(data.toString()); notify(textStatus.toString()); }, error: function (data, textStatus, jqXHR) { notify(textStatus); } }); 
 $("#save").click(function(){ $("#save").ajaxError(function(event,xhr,settings,error){ $(this).html{'error: ' (xhr ?xhr.status : '')+ ' ' + (error ? error:'unknown') + 'page: '+settings.url); }); }); 

Tiene un objeto JSON de la excepción lanzada, en el objeto xhr. Solo usa

 alert(xhr.responseJSON.Message); 

El objeto JSON expone otras dos propiedades: ‘ExceptionType’ y ‘StackTrace’

  error:function (xhr, ajaxOptions, thrownError) { alert(xhr.status); alert(thrownError); } 

Lanza una nueva excepción en el servidor usando:

Response.StatusCode = 500

Response.StatusDescription = ex.Message ()

Creo que StatusDescription se devuelve a la llamada Ajax …

Ejemplo:

  Try Dim file As String = Request.QueryString("file") If String.IsNullOrEmpty(file) Then Throw New Exception("File does not exist") Dim sTmpFolder As String = "Temp\" & Session.SessionID.ToString() sTmpFolder = IO.Path.Combine(Request.PhysicalApplicationPath(), sTmpFolder) file = IO.Path.Combine(sTmpFolder, file) If IO.File.Exists(file) Then IO.File.Delete(file) End If Catch ex As Exception Response.StatusCode = 500 Response.StatusDescription = ex.Message() End Try 

Aunque han pasado muchos años desde que se hizo esta pregunta, todavía no encuentro xhr.responseText como la respuesta que estaba buscando. Me devolvió la cadena en el siguiente formato:

 "{"error":true,"message":"The user name or password is incorrect"}" 

que definitivamente no quiero mostrar a los usuarios. Lo que estaba buscando es algo como a continuación:

 alert(xhr.responseJSON.message); 

xhr.responseJSON.message me da el mensaje exacto del objeto Json que se puede mostrar a los usuarios.

 $("#fmlogin").submit(function(){ $("#fmlogin").ajaxError(function(event,xhr,settings,error){ $("#loading").fadeOut('fast'); $("#showdata").fadeIn('slow'); $("#showdata").html('Error please, try again later or reload the Page. Reason: ' + xhr.status); setTimeout(function() {$("#showdata").fadeOut({"opacity":"0"})} , 5500 + 1000); // delays 1 sec after the previous one }); }); 

Si hay alguna forma, envíela con validar

simplemente usa el rest del código

 $("#fmlogin").validate({... 

... ... });

Primero debemos establecer en web.config:

    ****   

Además de que en el nivel jquery en la parte de error necesita analizar la respuesta de error que contiene una excepción como:

 .error(function (response, q, t) { var r = jQuery.parseJSON(response.responseText); }); 

Luego, usando r.Message puedes mostrar texto de excepción.

Verifique el código completo: http://www.codegateway.com/2012/04/jquery-ajax-handle-exception-thrown-by.html

Esta función genera básicamente claves de API aleatorias únicas y, en caso de que no lo haga, aparece un cuadro de diálogo emergente con un mensaje de error.

En la página de visualización:

 

Desde el controlador:

 public function regenerate(){ $json = array(); $api_key = substr(md5(rand(0,100).microtime()), 0, 12); $json['sync_id'] = $api_key; $json['message'] = 'Successfully API Generated'; $this->response->addHeader('Content-Type: application/json'); $this->response->setOutput(json_encode($json)); } 

El parámetro de callback opcional especifica una función de callback que se ejecutará cuando se complete el método load (). La función de callback puede tener diferentes parámetros:

Tipo: Función (jqXHR jqXHR, String textStatus, String errorThrown)

Una función a llamar si la solicitud falla. La función recibe tres argumentos: el objeto jqXHR (en jQuery 1.4.x, XMLHttpRequest), una cadena que describe el tipo de error que ocurrió y un objeto de excepción opcional, si se produjo uno. Los valores posibles para el segundo argumento (además de nulo) son “tiempo de espera”, “error”, “abortar” y “parsererror”. Cuando se produce un error HTTP, errorThrown recibe la parte textual del estado HTTP, como “No encontrado” o “Error interno del servidor”. A partir de jQuery 1.5, la configuración de error puede aceptar una matriz de funciones. Cada función se llamará a su vez. Nota: Este controlador no se llama para secuencias de comandos entre dominios y solicitudes JSONP entre dominios.