识别 Javascript 中的网络错误答案

【问题标题】：Identify network error in Javascript识别 Javascript 中的网络错误
【发布时间】：2020-01-03 15:52:11
【问题描述】：

上下文：

编写一个基于浏览器的工具，该工具可以访问多个 3rd 方 URL，以查看我们是否可以访问该 URL

约束

1. Has to be browser based 
2. I don't own the URL list (read it from a server and is maintained by someone else )
3. Some of the URLs (ie the servers) are not CORs enabled.

传统上，我会使用XMLHttpRequest 并执行this 之类的操作来查看是否存在网络错误。但是，由于这些是跨域请求，因此在飞行前步骤失败。

到目前为止，我所做的是一个 hack。这是代码。基本上是动态创建一个脚本标签，以 src 作为我想要获取的 url。

var createScript = function(whitelist){
    var src = whitelist.url;
    var script = document.createElement('script');
    script.setAttribute('src', src);
    script.onload = function () {

        whitelist.success = true;
        $scope.$digest();
        return;
    };
    script.onerror = function (foo) {
            console.error(src,' ',foo);
        return;
    };
    angular.element(document.body).append(script);
};

我查看了传递给onerror 的对象，但我无法从中获得任何有用的信息，这将帮助我理解失败的原因。此外，网络错误和 403 都命中了 onerror 处理程序。就我而言，访问 url 的成功或失败取决于网络错误，而不是获取例如 403。

问题

在给定的限制条件下，有没有一种方法可以让我确定成功或失败。就我而言，成败在于你能不能访问或不访问 URL。

【问题讨论】：

标签： javascript network-protocols

【解决方案1】：

我最终为此编写了一个可安装的 chrome 应用程序和一个 chrome 扩展程序。根据您的用例，可以使用任何一种。如果您想从 3rd 方网页使用相同的功能，则 chromme 扩展程序更多。

https://github.com/sajit/clienthealthcheck

https://github.com/sajit/healthcheck_api

【讨论】：