programing

jQuery ajax 일반 오류 처리 및 경우에 따라 처리

padding 2023. 9. 20. 20:10
반응형

jQuery ajax 일반 오류 처리 및 경우에 따라 처리

일반적인 ajax Error 핸들러는 다음과 같이 기록되어 있습니다.

$('html').ajaxError(function(e, xhr, settings, exception) {

    var message = '';

    if (xhr.status == 0) {
        message = 'You are offline!\n Please check your network.';
    }
    else if (xhr.status == 403) {
        window.location.href = $('#logon').attr('href');
    }
    else if (xhr.status == 404) {
        message = 'Requested URL not found.';
    }
    else if (xhr.status == 500) {

        message = xhr.responseText;

        $('#cboxLoadedContent div.news_article_content').append('<p>' + message + '</p>');

        try {//Error handling for POST calls
            message = JSON.parse(xhr.responseText);
        }

        catch (ex) {//Error handling for GET calls
            message = xhr.responseText;
        }

    }
    else if (errStatus == 'parsererror') {
        message = 'Error.\nParsing JSON Request failed.';

    }
    else if (errStatus == 'timeout') {
        message = 'Request timed out.\nPlease try later';
    }
    else {
        message = ('Unknown Error.\n' + xhr.responseText);
    }

    if (message != '' && xhr.status != 500) {
        message = message;
    }

    if (xhr.status != 403) {

        $('#icis_dashboard').append('<p id="ajax_error_msg" class="offScreen">' + message + '</p>');

        errorBox({
            inline: true,
            width: 0,
            href: '#ajax_error_msg',
            onLoadCall: function() { $('#cboxLoadedContent').jScrollPaneRemove(); },
            onCleanupCall: function() { $('#ajax_error_msg').remove(); }
        });
    }

});

따라서 오류가 403이 아닐 경우 오류와 관련된 텍스트와 함께 대화상자가 표시됩니다.

이것은 괜찮지만 제가 하고 싶은 것은 일반 핸들러를 백업으로 한 다음 원래의 axis 호출 내에서 개별적으로 각각의 오류를 처리하는 것입니다.

백업 핸들러가 404의 "bar"를 경고할 때 대신 "foo"를 경고하고 싶습니다.

            error: function(xhr) {
            if (xhr.status == 404) {
                //window.location.href = $('#logon').attr('href');
                alert("foo");    
            }
        }

어쨌든 이걸 할 수 있는 곳이 있습니까?지금은 둘 다 작동하는 것 같아서 백업이 작동하는 것을 어떻게 방지해야 할지 모르겠습니다.

자체 오류 처리를 수행하는 ajax 함수에서 ajax 속성 "global"을 false로 설정할 수 있습니다.이를 통해 글로벌 오류 처리를 방지할 수 있습니다.확인: http://api.jquery.com/jQuery.ajax#toptions .

jQuery로는 통제가 안 될 것 같아요.글로벌 ajaxError는 ajax 호출 중에 발생하는 모든 오류에 대해 호출됩니다.그러나 "로컬" 오류 콜백은 글로벌 콜백보다 먼저 호출되므로 글로벌 콜백이 실행되지 않도록 하는 변수를 설정할 수 있습니다.

예를 들어 다음과 같습니다.

var handledLocally = false;

$('html').ajaxError(function(e, xhr, settings, exception) {
    if (!handledLocally){
        //run the normal error callback code and the reset handledLocally
    }
});

error: function(){
    //set handledLocally to true to let the global callback it has been taken care of
    handledLocally = true;
}

이를 수행할 수 있는 방법을 보여주는 이 jsFiddle을 볼 수 있습니다(링크를 클릭하기 전에 맨 위에서 실행을 클릭하십시오). http://jsfiddle.net/e7By8/

글로벌 변수를 설정하는 것은 여러 개의 ajax 요청을 동시에 할 수 있기 때문에 나쁜 생각이라고 생각합니다.앞서 언급한 바와 같이 "로컬" 오류 콜백은 글로벌 콜백 전에 호출됩니다.제 해결책은 jqXHR 개체에 사용자 지정 속성을 첨부하여 예를 들어 로컬 핸들러에서 true로 설정하고 글로벌 핸들러에서 확인하는 것입니다.

로컬 처리:

$.ajax({
   //some settings
   error:function(jqXHR, textStatus, errorThrown){
      //handle and after set
      jqXHR.handledLocally = true

   }
})

전역 처리:

$(document).ajaxError(function (event, jqXHR, ajaxSettings, thrownError) {
    if (jqXHR.handledLocally)) {
        return;
    }
    //handle global error
})

우리는 실제로 다음과 같이 해결했습니다.

function ajaxError(xhr, textStatus, errorThrown) {

    var message = '';

    if (xhr.status == 0) {
        message = 'You are offline!\n Please check your network.';
    }
    else if (xhr.status == 403) {
        window.location.href = $('#logon').attr('href');
    }
    else if (xhr.status == 404) {
        message = 'Requested URL not found.';
    }
    else if (xhr.status == 500) {

        message = xhr.responseText;

        $('#cboxLoadedContent div.news_article_content').append('<p>' + message + '</p>');

        try {//Error handling for POST calls
            message = JSON.parse(xhr.responseText);
        }

        catch (ex) {//Error handling for GET calls
            message = xhr.responseText;
        }

    }
    else if (errStatus == 'parsererror') {
        message = 'Error.\nParsing JSON Request failed.';

    }
    else if (errStatus == 'timeout') {
        message = 'Request timed out.\nPlease try later';
    }
    else {
        message = ('Unknown Error.\n' + xhr.responseText);
    }

    if (message != '' && xhr.status != 500) {
        message = message;
    }

    if (xhr.status != 403) {

        $('#icis_dashboard').append('<p id="ajax_error_msg" class="offScreen">' + message + '</p>');

        errorBox({
            inline: true,
            width: 0,
            href: '#ajax_error_msg',
            onLoadCall: function() { $('#cboxLoadedContent').jScrollPaneRemove(); },
            onCleanupCall: function() { $('#ajax_error_msg').remove(); }
        });
    } 
};

따라서 모든 AJAX 호출은 이제 두 가지 방법 중 하나로 펑션을 참조합니다.

1) 만약 우리가 디폴트가 발생하기를 원한다면

error: ajaxError

2) 우리가 특정 상황을 목표로 하고 싶다면, 만약 그것이 잡히지 않는다면, 기본값으로 진행합니다.

    error: function(xhr) {

        if (xhr.status == 404) {
            alert("local");
        }
        else {
            // revert to default
            ajaxError.apply(this, arguments);
        }
    }

이것은 오래된 질문이지만, 누군가에게는 유용할 수도 있습니다.이 답변의 문제점은 글로벌 핸들러에 실행해야 할 코드가 있을 수 있다는 것입니다.저는 이 다른 답변이 더 유용하다는 것을 알았지만, 글로벌 변수를 사용하는 것은 그다지 좋은 방법이 아닙니다.또한 동시에 둘 이상의 ajax call이 발생할 수 있으며 작동하지 않습니다.저는 이 대안을 약간 다르게 제안합니다.

$(document).ajaxError(function(event, jqxhr, settings, thrownError) {
    // Global validation like this one:
    if (jqxhr.status == 401) { window.location = "/login"; }

    if (!settings.handErrorLocally) {
        // Unhandled error.
        alert("Ooops... we have no idea what just happened");
    }
});

그리고 아무 아약스를 호출할 때 직접 오류를 처리할 수도 있습니다.

$.ajax({
    url: "/somePage/",
    handErrorLocally: true
}).done(function () {
    alert("good");
}).fail(function () {
    alert("fail");
});

아니면 글로벌 핸들러가 처리하도록 합니다.

$.ajax({
    url: "/somePage/"
}).done(function () {
    alert("good");
});

전역 오류 처리기를 함수로 정의

function ajaxError() {
  var message = '';

  if (xhr.status == 0) {
    message = 'You are offline!\n Please check your network.';
  }
  .....
}

그리고 jQuery.jax 래퍼를 만듭니다.

function doAjax(url, fnError) {
  jQuery.ajax(url, {
    error: fnError || defaultErrorHandler 
  })
}

이제 기본 jQuery.jax 대신 이 래퍼를 사용합니다.

doAjax('/someResource'); // defaultErrorHandler using for handle error
doAjax('/someResource', function() {...}); // custom error function using

매우 유용했던 팀 뱅크스의 답변을 추가합니다.나는 단지 그가 글로벌 변수를 사용한다는 사실을 바꾸고 ajax call에서 설정을 사용하고 싶습니다.기본적으로 뒤로 빠지는 것으로 설정했지만 이는 쉽게 변경될 수 있습니다.

$('html').ajaxError(function(e, xhr, settings, exception) {
    if (xhr.status == 404) {
        alert("html error callback");    
    }
});

$.ajax({
    url: "missing.html",
    global: true
});

글로벌 이벤트 핸들러로 전파할지 여부를 결정하는 글로벌 설정을 사용하도록 답변을 편집했습니다.

언급URL : https://stackoverflow.com/questions/4887295/jquery-ajax-generic-error-handling-and-on-a-case-by-case-basis

반응형