programing

jQuery Ajax 오류 처리, 사용자 지정 예외 메시지 표시

mailnote 2023. 3. 17. 21:48
반응형

jQuery Ajax 오류 처리, 사용자 지정 예외 메시지 표시

jQuery AJAX 오류 메시지에서 커스텀 예외 메시지를 경보로 표시할 수 있는 방법이 있습니까?

예를 들어 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);
      }
    });
  }
});

두 합니다.thrownError, 나는 받고 있다.undefinedxhr.status는 「」입니다.500.

어디가 잘못됐는지 모르겠어요.이 문제를 해결하려면 어떻게 해야 하나요?

세팅하고 Response.StatusCode200200 이외으로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);
    }
});

Server Side:

     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 오류 처리

모든 ajax 요청에 대해 일반적인 오류 처리를 수행해야 하는 경우.html 콘텐츠 상단에 error container라는 이름의 div에 ajaxError 핸들러를 설정하고 에러를 표시합니다.

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

요.responseText 사용:JQuery 사 :

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

asp.net 에 콜을 발신하면, 다음의 에러 메세지 제목이 반환됩니다.

제가 모든 formatErrorMessage를 직접 쓴 것은 아니지만 매우 유용하다고 생각합니다.

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()는, 「」로 합니다..error()3.0jQuery 3.되지 않습니다.

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

도움이 되었으면 좋겠다

이것이 제가 한 일이며 지금까지 MVC 5 어플리케이션에서 동작하고 있습니다.

컨트롤러의 반환 유형은 Content Result입니다.

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

클라이언트 측에서는 다음과 같이 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;
    }
});

일반적인/재이용 가능한 솔루션

이 답변은 이 문제에 부닥친 모든 문제를 향후 참조하기 위해 제공됩니다.솔루션은 다음 두 가지 요소로 구성됩니다.

  1. ModelStateException서버에서 검증에 실패했을 때 느려집니다(모델 상태에서는 데이터 주석을 사용하고 강력한 유형의 컨트롤러 액션 파라미터를 사용할 때 검증 오류가 보고됩니다).
  2. HandleModelStateExceptionAttribute를 반환하고 , HTTP 에러, HTTP 에러, 를 반환합니다.

이 "jQuery Ajax"를 통해 할 수 있는 수 .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
}

모든 문제는 이 블로그 투고에 자세히 설명되어 있습니다.이 블로그 투고에서는 어플리케이션에서 이를 실행하기 위한 모든 코드를 찾을 수 있습니다.

 error:function (xhr, ajaxOptions, thrownError) {
        alert(xhr.status);
        alert(thrownError);
      }
in code error ajax request for catch error connect between client to server if you want show error message of your application send in success scope

예를 들어

success: function(data){
   //   data is object  send  form server 
   //   property of data 
   //   status  type boolean 
   //   msg     type string
   //   result  type string
  if(data.status){ // true  not error 
         $('#api_text').val(data.result);
  }
  else 
  {
      $('#error_text').val(data.msg);
  }

}

서버로부터 송신하고 있던 메시지를 해석해, 스택 트레이스 없이 유저에게 알기 쉬운 메세지를 표시할 수 있기 때문에, 이것은 좋은 일이라고 생각했습니다.

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

이 함수는 기본적으로 고유한 임의 API 키를 생성하며, 생성되지 않을 경우 오류 메시지가 표시된 팝업 대화 상자가 나타납니다.

보기 페이지:

<div class="form-group required">
    <label class="col-sm-2 control-label" for="input-storename"><?php echo $entry_storename; ?></label>
    <div class="col-sm-6">
        <input type="text" class="apivalue"  id="api_text" readonly name="API" value="<?php echo strtoupper(substr(md5(rand().microtime()), 0, 12)); ?>" class="form-control" />                                                                    
        <button type="button" class="changeKey1" value="Refresh">Re-Generate</button>
    </div>
</div>

<script>
$(document).ready(function(){
    $('.changeKey1').click(function(){
          debugger;
        $.ajax({
                url  :"index.php?route=account/apiaccess/regenerate",
                type :'POST',
                dataType: "json",
                async:false,
                contentType: "application/json; charset=utf-8",
                success: function(data){
                  var result =  data.sync_id.toUpperCase();
                        if(result){
                          $('#api_text').val(result);
                        }
                  debugger;
                  },
                error: function(xhr, ajaxOptions, thrownError) {
                  alert(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText);
                }

        });
    });
  });
</script>

컨트롤러에서:

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

옵션의 callback 파라미터는 load() 메서드가 완료되었을 때 실행할 콜백 함수를 지정합니다.콜백 함수는 다른 파라미터를 가질 수 있습니다.

유형: 함수( jqXHR jqXHR, String textStatus, String 오류)던짐)

요청이 실패했을 때 호출되는 함수입니다.함수는 다음 3개의 인수를 수신합니다.jqXHR(jQuery 1.4.x, XMLHttpRequest의 경우) 객체. 발생한 오류의 유형을 설명하는 문자열 및 발생한 경우 옵션 예외 객체입니다.두 번째 인수(null 제외)에 사용할 수 있는 값은 "timeout", "error", "abort" 및 "parserror"입니다.HTTP 에러가 발생하면, 에러가 발생합니다.느려짐은 "Not Found" 또는 "Internal Server Error"와 같은 HTTP 상태의 텍스트 부분을 수신합니다.jQuery 1.5에서는 오류 설정으로 함수 배열을 허용할 수 있습니다.각 함수가 차례로 호출됩니다.주의: 이 핸들러는 크로스 도메인스크립트 및 크로스 도메인 JSONP 요청에서는 호출되지 않습니다.

이는 아마도 JSON 필드 이름에 따옴표가 없기 때문일 수 있습니다.

JSON 구조를 다음과 같이 변경합니다.

{welcome:"Welcome"}

대상:

{"welcome":"Welcome"}

xhr 객체에 예외의 JSON 객체가 느려졌습니다.그냥 사용하다

alert(xhr.responseJSON.Message);

JSON 개체는 '예외'라는 두 가지 다른 속성을 표시합니다.유형' 및 'StackTrace'

Ajax 응답 핸들러는 HTTP 상태 코드를 사용하여 오류가 발생했는지 여부를 확인할 수 있을 것입니다.

따라서 서버 측 코드에 Java 예외만 발생시켰을 때 HTTP 응답에 500 상태 코드 jQuery(이 경우 XMLHttpRequest 객체)가 없는 경우 모든 것이 정상이라고 가정합니다.

ASP에서도 비슷한 문제가 있어서 하는 말이에요.논쟁 같은 걸 던지던 NET예외('어떻게 해야 할지 모르겠어요')( ). 그러나 에러 핸들러는 기동하지 않았습니다.

'아, 아, 아, 아, 아, 아, 아, 아, 아, 아, 아, 아, 아, 아, 'Response.StatusCode500 또는 200으로 줄인다고 합니다.

jQuery.parseJSON은 성공과 오류에 도움이 됩니다.

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

다음을 사용하여 서버에 새 예외 발생:

대답.상태 코드 = 500

대답.StatusDescription = ex.메시지()

StatusDescription이 Ajax 콜로 반환되는 것으로 알고 있습니다.

예:

        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

이 질문이 나온 지 몇 년이 지났지만 아직도 잘 모르겠다.xhr.responseText제가 찾던 답으로요다음 형식의 문자열을 반환했습니다.

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

사용자들에게 절대 보여주고 싶지 않아요.제가 찾고 있던 것은 다음과 같습니다.

alert(xhr.responseJSON.message);

xhr.responseJSON.messageJson 객체에서 사용자에게 보여줄 수 있는 정확한 메시지를 제공합니다.

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

validate와 함께 제출되는 양식이 있는 경우

코드의 나머지를 간단하게 사용하다

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

... ... });

먼저 <serviceDebug include>를 설정해야 합니다.ExceptionDetailInFaults="True" /> web.config:

<serviceBehaviors> 
 <behavior name=""> 
  <serviceMetadata httpGetEnabled="true" /> 
    **<serviceDebug includeExceptionDetailInFaults="true" />** 
 </behavior> 
</serviceBehaviors>

또한 오류 부분의 jquery 수준에서 다음과 같은 예외가 포함된 오류 응답을 구문 분석해야 합니다.

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

r을 사용합니다.예외 텍스트를 표시할 수 있는 메시지입니다.

완전한 코드를 확인합니다.http://www.codegateway.com/2012/04/jquery-ajax-handle-exception-thrown-by.html

제 경우 컨트롤러에서 HTTP VERB를 방금 삭제했습니다.

    **//[HttpPost]**   ---- just removed this verb
    public JsonResult CascadeDpGetProduct(long categoryId)
    {
       
        List<ProductModel> list = new List<ProductModel>();
        list = dp.DpProductBasedOnCategoryandQty(categoryId);
        return Json(new SelectList(list, "Value", "Text", JsonRequestBehavior.AllowGet));
    }

언급URL : https://stackoverflow.com/questions/377644/jquery-ajax-error-handling-show-custom-exception-messages

반응형