Обнаружить ошибку XHR действительно из-за остановки браузера или перехода на новую страницу

Question

Когда моя страница загружает контент через XHR, если пользователь нажимает кнопку «Стоп» или щелкает, чтобы перейти на другую страницу, вызывается функция XHR error (). Обычно это не имеет большого значения, если бы пользователь не шокировался, увидев много (красных) сообщений об ошибках на странице.

Сообщения действительны - действительно, при извлечении контента произошла ошибка - но это происходит из-за взаимодействия с пользователем, а не из-за сбоя системы.

Есть ли способ различить (ошибка 404 | 500 | тайм-аут) и ошибку, вызванную тем, что пользователь нажал кнопку остановки браузера?

РЕДАКТИРОВАТЬ: я использую Dojo (отсюда ссылка на функцию ошибки), но я полагаю, что это будет ситуация, распространенная в любой реализации XHR. Я буду смотреть на readyState объекта xhr, когда error () вызывается

Answer 1

Чтобы различать ошибки HTTP (404, 401, 403, 500 и т. Д.) И запрашивать ошибки прерывания (т. Е. Пользователь нажал Esc или перешел на другую страницу), вы можете проверить Свойство XHR.status, если запрос был прерван, статус участника будет равен нулю:

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

Простая функция postRequest:

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

Запустите приведенный выше фрагмент здесь .