从 URL 获取即使在捕获它之后也会在控制台中显示错误？

Question

假设，我有这个函数，提供了一个错误的 'uri' 字符串来获取：

function imgChanger(uri) {
    fetch('uri', { mode: 'cors' })//WRONG 'uri' to demonstrate that catch doesn't prevent console's red error
        .then(function (response) {
            if (!response.ok) {
                throw new Error(response.statusText);
            }
            return response.json();
        }).then(function (response) {
            img.src = response.data.images.original.url;
        }).catch((err)=>{
            console.log(err);
        });
}

尽管处理了错误，但我可以在控制台中看到 404 消息：

对此我有两个问题：为什么在捕捉到它的情况下仍然显示它，我该如何处理？

Answer 1

恐怕你在这里无能为力。大约 10 (!) 年前在 Chromium 中打开了 an Issue 124534: Provide a way not to display 404 XHR errors in console：

Chromium 在 Javascript 中始终将 HTTP 404 显示为错误 安慰。除了在可能的情况下将线路噪声强加给开发人员 不想要它（可以在“网络”选项卡中轻松发现 404），我认为 这实际上违背了 HTTP 的精神。如果你有一个 例如，电话目录查找，然后您 GET http://myHost/directory/numbers/12345678

...如果该号码不在 目录。在我看来，这甚至是一个“错误”——它只是 信息。为什么 Chromium 应该在 控制台？

如您所见，它仍然是开放的（本质上被视为“按设计”）。这是另一个有说服力的报价：

8 年过去了，我仍然无法控制客户如何回应 要求。我们的内部 API 已更改为始终响应 200，带有自定义状态字段以正确过滤实际情况 错误以及根本不存在的内容。

我们不得不从 REST 转移到真正的 使用语义状态。

但要高兴！似乎在 2021 年开始了讨论，所以希望我们最终能取得进展。现在，不幸的是，这并不容易：

似乎普遍认为最好 从控制台中删除这些错误消息。但是也很 可能目前很多 DevTools 用户依赖于这些错误 工作流程中的消息。我们还没有找到调和的方法 这两个方面。

现在是强制性的xkcd comic：