Question

当我的页面通过XHR加载内容时，如果用户单击停止按钮或单击转到另一个页面，则会调用XHR error（）函数。除了在页面上看到大量（红色）错误消息的用户震惊之外，这通常不是什么大问题。

消息有效 - 检索内容确实有错误 - 但这是由于用户交互，而不是因为系统故障。

有没有办法区分a（404 | 500 |超时错误）和用户点击浏览器停止按钮导致的错误？

编辑：我正在使用Dojo（因此是错误函数引用），但我相信这将是任何XHR实现中常见的情况。当调用error（）

时，我将查看xhr对象的readyState

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

运行以上代码段here。

检测XHR错误确实是由于浏览器停止或点击进入新页面

1 个答案: