jQuery अजाक्स त्रुटि हैंडलिंग, कस्टम अपवाद संदेश दिखाएं




ajax custom-exceptions (14)

क्या कोई तरीका है कि मैं अपने jQuery AJAX त्रुटि संदेश में एक अलर्ट के रूप में कस्टम अपवाद संदेश दिखा सकता हूं?

उदाहरण के लिए, यदि मैं throw new ApplicationException("User name already exists"); अपवाद throw new ApplicationException("User name already exists"); Struts माध्यम से सर्वर पक्ष पर अपवाद फेंकना चाहता हूं throw new ApplicationException("User name already exists"); , मैं 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);
      }
    });
  }
});

दूसरी चेतावनी पर, जहां मैं फेंक दिया त्रुटि चेतावनी देता हूं, मुझे undefined और स्थिति कोड 500 है।

मुझे यकीन नहीं है कि मैं कहां गलत हो रहा हूं। इस समस्या को सुलझाने में मैं क्या कर सकता हूं?


एक सामान्य / पुन: प्रयोज्य समाधान

यह उत्तर उन सभी लोगों के भविष्य के संदर्भ के लिए प्रदान किया गया है जो इस समस्या में टक्कर डालते हैं। समाधान में दो चीजें होती हैं:

  1. कस्टम अपवाद ModelStateException जो सर्वर पर सत्यापन विफल होने पर फेंक दिया जाता है (जब हम डेटा एनोटेशन का उपयोग करते हैं और मजबूत टाइप किए गए नियंत्रक एक्शन पैरामीटर का उपयोग करते हैं तो मॉडल राज्य रिपोर्ट सत्यापन त्रुटियां)
  2. कस्टम नियंत्रक कार्रवाई त्रुटि फ़िल्टर HandleModelStateExceptionAttribute जो कस्टम अपवाद को पकड़ता है और शरीर में मॉडल स्थिति त्रुटि के साथ HTTP त्रुटि स्थिति देता है

यह jQuery अजाक्स कॉल के लिए इष्टतम आधारभूत संरचना प्रदान करता है ताकि success और error हैंडलर के साथ अपनी पूरी क्षमता का उपयोग किया जा सके।

ग्राहक पक्ष कोड

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

सर्वर साइड कोड

[HandleModelStateException]
public ActionResult Create(User user)
{
    if (!this.ModelState.IsValid)
    {
        throw new ModelStateException(this.ModelState);
    }

    // create new user because validation was successful
}

इस ब्लॉग पोस्ट में पूरी समस्या विस्तृत है जहां आप इसे अपने एप्लिकेशन में चलाने के लिए सभी कोड पा सकते हैं।


Xhr ऑब्जेक्ट में आपके पास अपवाद का JSON ऑब्जेक्ट है। महज प्रयोग करें

alert(xhr.responseJSON.Message);

JSON ऑब्जेक्ट दो अन्य गुणों का खुलासा करता है: 'अपवाद टाइप' और 'स्टैकट्रेस'


अगर एएसपीनेट पर कॉल करना है, तो यह त्रुटि संदेश शीर्षक वापस कर देगा:

मैंने खुद के सभी प्रारूपों को नहीं लिखा है लेकिन मुझे यह बहुत उपयोगी लगता है।

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

अगर कोई उत्तर के लिए 2016 में यहां है, तो त्रुटि प्रबंधन के लिए .fail() उपयोग करें .fail() को jQuery 3.0 के रूप में बहिष्कृत किया गया है

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

मुझे उम्मीद है यह मदद करेगा


मुझे यह अच्छा लगता है क्योंकि मैं सर्वर से जो संदेश भेज रहा था उसे पार्स कर सकता हूं और बिना किसी स्टैकट्रैक के उपयोगकर्ता को एक दोस्ताना संदेश प्रदर्शित कर सकता हूं ...

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

मेरा मानना ​​है कि अजाक्स प्रतिक्रिया हैंडलर यह जांचने के लिए HTTP स्थिति कोड का उपयोग करता है कि कोई त्रुटि हुई है या नहीं।

इसलिए यदि आप अपने सर्वर साइड कोड पर जावा अपवाद फेंकते हैं लेकिन फिर HTTP प्रतिक्रिया में 500 स्थिति कोड jQuery नहीं है (या इस मामले में शायद XMLHttpRequest ऑब्जेक्ट) यह मान लेगा कि सब कुछ ठीक था।

मैं यह कह रहा हूं क्योंकि मुझे एएसपी.नेट में एक ही समस्या थी, जहां मैं एक ArgumentException की तरह कुछ फेंक रहा था ("पता नहीं क्या करना है ...") लेकिन त्रुटि हैंडलर फायरिंग नहीं कर रहा था।

फिर मैंने Response.StatusCode को 500 या 200 पर सेट किया था, चाहे मुझे कोई त्रुटि हो या नहीं।


यद्यपि यह प्रश्न पूछे जाने के कई सालों बाद भी, मुझे अभी भी xhr.responseText नहीं मिला है जैसा कि मैं xhr.responseText रहा था। यह मुझे निम्नलिखित प्रारूप में स्ट्रिंग वापस कर दिया:

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

जो मैं निश्चित रूप से उपयोगकर्ताओं को दिखाना नहीं चाहता हूं। जो मैं खोज रहा था वह नीचे जैसा कुछ है:

alert(xhr.responseJSON.message);

xhr.responseJSON.message मुझे xhr.responseJSON.message ऑब्जेक्ट से सटीक संदेश देता है जिसे उपयोगकर्ताओं को दिखाया जा सकता है।


यह शायद JSON फ़ील्ड नामों के कारण उद्धरण चिह्न नहीं है।

JSON संरचना को यहां से बदलें:

{welcome:"Welcome"}

सेवा मेरे:

{"welcome":"Welcome"}

सर्वर पर एक नया अपवाद फेंक दें:

Response.StatusCode = 500

Response.StatusDescription = ex.Message ()

मेरा मानना ​​है कि स्टेटस डिस्क्रिप्शन अजाक्स कॉल में वापस आ गया है ...

उदाहरण:

        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

सुनिश्चित करें कि आप Response.StatusCode को 200 से अलग कुछ पर सेट कर रहे हैं। Response.Write का उपयोग करके अपना अपवाद का संदेश लिखें, फिर उपयोग करें ...

xhr.responseText

..अपने जावास्क्रिप्ट में।


नियंत्रक:

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

स्क्रिप्ट देखें:

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

सर्वर साइड:

     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

           }
 }

ग्राहक की ओर:

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

जेनेरिक अजाक्स त्रुटि हैंडलिंग

अगर मुझे सभी AJAX अनुरोधों के लिए कुछ सामान्य त्रुटि प्रबंधन करने की आवश्यकता है। मैं AJAXError हैंडलर सेट करूंगा और HTML सामग्री के शीर्ष पर त्रुटि कंटेनर नामक एक div पर त्रुटि प्रदर्शित करूंगा।

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

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

यदि कोई फॉर्म मान्य के साथ सबमिट किया गया है

बस बाकी कोड का उपयोग करें

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

... ... });


$("#save").click(function(){
    $("#save").ajaxError(function(event,xhr,settings,error){
        $(this).html{'error: ' (xhr ?xhr.status : '')+ ' ' + (error ? error:'unknown') + 'page: '+settings.url);
    });
});






custom-exceptions