如何使用 javascript 检测 err_name_not_resolved？答案

【问题标题】：how to detect err_name_not_resolved with javascript?如何使用 javascript 检测 err_name_not_resolved？
【发布时间】：2016-11-07 18:29:49
【问题描述】：

我目前正在开发一个 google chrome 扩展程序，用于收集有关用户访问的网页的信息。目前，我的插件能够处理 2xx、3xx、4xx 和 5xx 状态码。但是，我还需要检测网站何时不存在，我得到错误代码ERR_NAME_NOT_RESOLVED。我如何在javascript中做到这一点？似乎我的XMLHttpRequest 甚至无法在不存在的网站上触发。我该如何解决这个问题？

【问题讨论】：

try{x=new XMLHttpRequest();x.open("http://dvcsdfsd.com")}catch(y){alert(y)} 工作...
如果站点不存在，它不应该返回 404 吗？会不会是DNS issue？
@neilsimp1 我可以处理 404，我说的是 DNS 问题。
@neilsimp1: 如果一个站点不存在，它如何返回 404（或其他任何内容）？
@dandavis 请不要将答案作为评论留下，请发布问题的实际答案。如果你能详细说明一下，那也很棒。谢谢

标签： javascript google-chrome google-chrome-extension dns xmlhttprequest

【解决方案1】：

XMLHttpRequest 的 onreadystatechange 监听器在此处为现有站点触发了 2 次以上，而对于不存在的站点，只有一次 status 属性等于 0，所以这段代码对我有用：

function xhrGetStatus(url, callback) {
    var xhr = new XMLHttpRequest();
    xhr.open('HEAD', url);
    xhr.onreadystatechange = function(e) {
        xhr.onreadystatechange = null;
        callback({status: xhr.status, statusText: xhr.statusText});
    };
    xhr.send();
}

xhrGetStatus('http://abc123.com', function(r) {
    console.log(r.status ? r.status : 'No such site?');
});

【讨论】：

当服务器响应中不存在 CORS 标头时，status 可以为零，因此使用状态 0 来检测这是不可靠的。

【解决方案2】：

TL;DR：xhr.onerror 应该是您正在寻找的，但需要注意的是。

因此，当您的计算机没有连接时，您可能会遇到错误，并且我认为如果您无法连接到设备的 DNS 服务器。基本上是尝试启动 XHR 失败。

在控制台might not be preventable by design中会出现错误的显示，如果你想尝试捕捉它可以使用xhr的.onerror。 Try-catch 似乎对我不起作用，尽管它看起来应该 - 可能与它的异步性质有关？不确定。

还请记住，.onload即使出现错误也会运行，即使由于缺少连接而看起来不像这样。

如果您与您的 DNS 服务器建立了连接，但解析的站点根本不存在，您的 xhr 状态应为 404 并且不应出现此错误，而如果您没有连接/无法连接到DNS 服务器的 xhr 状态应该是 0 并且应该出现错误。

示例代码：

// you can assign a function because javascript
// in this example, we are using an anonymous function
const xhr = new XMLHttpRequest();
xhr.open('POST', '/');
xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');

// error handler example
xhr.onerror = () => {
    alert('error');
    console.log(xhr);
};

// needs to call as anonymous function to work right
xhr.onload = () => { handleResponse(xhr); };

xhr.send('example.com/action?input=yes');

正如我在上面提到的，因为 .onload 和 .onerror 都在运行（按此顺序），我更喜欢让我的 onload 函数同时处理错误和成功，希望这对你有用。

const handleResponse = (xhr) => {
  if (xhr.state === 200) {
    alert('you win');
  } else {
    alert('error');
  }
};

【讨论】：