在 JavaScript 中捕获 Access-Control-Allow-Origin 错误答案

【问题标题】：Catching an Access-Control-Allow-Origin error in JavaScript在 JavaScript 中捕获 Access-Control-Allow-Origin 错误
【发布时间】：2017-07-31 23:41:26
【问题描述】：

我编写了一个不断返回 Access-Control-Allow-Origin 错误的函数。 这对我来说其实很好；我不想解决这个问题。我只想抓住它，这样我就可以在我的程序中阅读它的消息。

导致错误抛出的所有代码都在我的 try 块中，而我的 catch 块显示错误的字符串消息。但是，当我运行代码时，没有发现任何错误，并且错误在控制台中显示为红色。如何捕获此错误并存储其消息？

        try {
            var xhr = new XMLHttpRequest();
            xhr.onload = function() {
                if (this.status < 400 && this.status >= 300) {
                    console.log('this redirects to ' + this.getResponseHeader("Location"));
                } else {
                    console.log('doesn\'t redirect');
                }
            }

            xhr.open('HEAD', $scope.suggLink, true);
            xhr.send();
        } catch(e) {
            console.log('Caught it!');
            console.log(e.message);
        }

【问题讨论】：

标签： javascript xmlhttprequest cors

【解决方案1】：

虽然浏览器本身会将更详细的错误消息记录到控制台，但您无法从代码中访问它。见https://bugs.chromium.org/p/chromium/issues/detail?id=118096#c5：

出于安全原因，XHR 和 Fetch API 的错误详情不会暴露给 JavaScript。

就此处实际需要的规范而言，Fetch 规范定义了“状态消息”的详细信息，以便在发生错误时提供 - 即使使用 XHR 而不是 Fetch API（XHR 规范参考获取规范）。对于浏览器阻止的任何网络错误或响应，Fetch 规范要求状态消息是“空字节序列”：

network error 是一个响应，其状态始终为 0，状态消息始终为空字节序列，标头列表始终为空，正文始终为空，尾部始终为空。

所以你能从你能捕捉到的任何错误中得到的只有 “TypeError: Failed to fetch” 之类的。

如果您使用 XHR，则处理错误所需的只是 onerror 事件处理程序：

xhr.onerror = function() { console.log("Error occurred but I dunno what exactly.")}

【讨论】：

可悲的是，虽然这让我可以触发控制台消息，但它并没有让我阻止默认错误消息。换句话说，我要澄清的是，不仅 XHR 和 Fetch API 的错误细节不会暴露给 JS，而且我们也不能阻止它们显示。超级跛脚。
使用 jquery: $.getJSON(sURL, function (json) { console.log('json from web-service ->', json); }) .fail(function() { console. log("错误 - 无法从服务中获取 json 数据"); });

【解决方案2】：

上面的 jquery 版本（sideshowbarker's）解决 CORS 错误：

let sURL = 'https://www.mocky.io/v2/5185415ba171ea3a00704eed';
$.getJSON(sURL, function (json)
{
    console.log('json from web-service ->', json);
})
.fail(function()
{
    console.log("error - could not get json data from service");
});

【讨论】：