Traitement des erreurs par jQuery Ajax, affichage de messages d'exception personnalisés

Question

Existe-t-il un moyen d'afficher des messages d'exception personnalisés sous forme d'alerte dans mon message d'erreur Ajax jQuery ?

Par exemple, si je veux lancer une exception du côté du serveur par le biais de Struts par "throw new ApplicationException("User name already exists") ;", je veux attraper ce message (nom d'utilisateur déjà existant) dans le message d'erreur de 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);
      }
    });
  }
});

Sur la deuxième alerte où j'ai déclenché une erreur, j'obtiens undefined et le code d'état est 500.

Je ne sais pas où je me trompe. Que puis-je faire pour résoudre ce problème ?

Answer 1

Assurez-vous de régler Response.StatusCode à quelque chose d'autre que 200. Rédigez le message de votre exception en utilisant Response.Write alors utilisez...

xhr.responseText

dans votre javascript.

Answer 2

Contrôleur :

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

Voir script :

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

Answer 3

Côté serveur :

     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

           }
 }

ClientSide :

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

Traitement générique des erreurs Ajax

Si j'ai besoin de faire un traitement générique des erreurs pour toutes les requêtes ajax. Je vais définir le gestionnaire ajaxError et afficher l'erreur dans un div nommé errorcontainer en haut du contenu html.

$("div#errorcontainer")
    .ajaxError(
        function(e, x, settings, exception) {
            var message;
            var statusErrorMap = {
                '400' : "Server understood the request but request content was invalid.",
                '401' : "Unauthorised access.",
                '403' : "Forbidden resouce can't be accessed",
                '500' : "Internal Server Error.",
                '503' : "Service Unavailable"
            };
            if (x.status) {
                message =statusErrorMap[x.status];
                                if(!message){
                                      message="Unknow 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="Unknow Error \n.";
            }
            $(this).css("display","inline");
            $(this).html(message);
                 });

Answer 4

Vous devez convertir le responseText en JSON. Utilisation de JQuery :

jsonValue = jQuery.parseJSON( jqXHR.responseText );

Answer 5

S'il s'agit d'un appel à asp.net, cela renverra le titre du message d'erreur :

Je n'ai pas écrit tout le formatErrorMessage moi-même mais je le trouve très utile.

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