XHR 오류 감지는 실제로 브라우저 중지 또는 새 페이지를 클릭하기 때문입니다.

Question

내 페이지가 XHR을 통해 콘텐츠를로드하는 동안 사용자가 중지 버튼을 클릭하거나 클릭하면 다른 페이지로 이동하면 XHR Error () 함수가 호출됩니다. 이것은 페이지에 많은 (빨간색) 오류 메시지를 보는 사용자 충격을 제외하고는 일반적으로 큰 문제가되지 않습니다.

메시지는 유효합니다. 실제로 컨텐츠를 검색하는 오류가 있었지만 시스템 고장으로 인해 사용자 상호 작용 때문입니다.

(404 | 500 | 타임 아웃 오류)와 사용자가 브라우저의 정지 버튼을 누른다는 사실로 인한 오류를 구별하는 방법이 있습니까?

편집 : DOJO (따라서 오류 함수 참조)를 사용하고 있지만 이것이 모든 XHR 구현에서 공통적 인 상황이라고 생각합니다. error ()가 호출 될 때 XHR 객체의 ReadyState를 살펴 보겠습니다.

Answer 1

HTTP 오류를 구별하기 위해 (404, 401, 403, 500, 등을 요청하고 낙태 오류 (즉, 사용자가 ESC를 누르거나 다른 페이지로 탐색) XHR.Status 속성을 확인할 수 있습니다. 요청이 중단 된 경우 상태 구성원이 0이됩니다.

document.getElementById('element').onclick = function () { 
  postRequest ('test/', null, function (response) { // success callback
    alert('Response: ' + response); 
  }, function (xhr, status) { // error callback
    switch(status) { 
      case 404: 
        alert('File not found'); 
        break; 
      case 500: 
        alert('Server error'); 
        break; 
      case 0: 
        alert('Request aborted'); 
        break; 
      default: 
        alert('Unknown error ' + status); 
    } 
  }); 
};

간단한 사후 기능 :

function postRequest (url, params, success, error) {  
  var xhr = XMLHttpRequest ? new XMLHttpRequest() : 
                             new ActiveXObject("Microsoft.XMLHTTP"); 
  xhr.open("POST", url, true); 
  xhr.onreadystatechange = function(){ 
    if ( xhr.readyState == 4 ) { 
      if ( xhr.status == 200 ) { 
    success(xhr.responseText); 
      } else { 
    error(xhr, xhr.status); 
      } 
    } 
  }; 
  xhr.onerror = function () { 
    error(xhr, xhr.status); 
  }; 
  xhr.send(params); 
} 

위의 스 니펫을 실행하십시오 여기.