Firefox 84/85 中的“尝试获取资源时出现网络错误”

Question

不久前，我们推出了一个由 GQL 后端支持的 React 网站。就在最近从收集到的客户端指标中，我们观察到在 84 和 85 版本的 Firefox 浏览器中获取数据期间出现以下错误的频率很高（截至发布此问题的最新时间）。

NetworkError when attempting to fetch resource.

在 React 应用程序中，使用 Apollo GraphQL 客户端来获取数据。整个 ApolloError 对象看起来像

{"graphQLErrors":[],"networkError":{},"message":"NetworkError when attempting to fetch resource."}

但是，当我们自己尝试上述浏览器版本时，无法重现。

我已经确认这不应该是 CORS 问题。我们有相当大的用户群，他们使用的 Firefox 浏览器版本范围很广，但只有 84 和 85 版本的出现率异常高。不久前，我们修复了一个similar issue，这是由于旧版本浏览器与Fetch api不兼容而导致的。

对于可能导致该问题的原因，我们有点不知所措。客户端的日志记录量受到限制以显示更多。任何见解或线索都受到高度赞赏。

Answer 1

最终我发现这不是与 Firefox 84/85 相关的错误。正如here 所解释的，当浏览器终止其进程时（很可能是由于用户导航到不同的页面或停止页面加载引起的），fetch API 只会抛出网络错误消息。

我已经在一些主要浏览器上验证了这一点，方法是在 fetch API 正在运行时故意停止页面加载。我收到的错误信息是：

• 铬和边缘 - Failed to fetch
• 火狐-NetworkError when attempting to fetch resource
• Safari - cancelled

不幸的是，只有 Safari 浏览器会返回正确的消息来解释可能发生的情况。

我认为通常可以安全地忽略这些错误，或者通过一次重试尝试来挽救它们，以防它们是由连接问题引起的。对于 Apollo GraphQL 客户端，更重要的是检查ApolloError 对象的graphQLErrors 和networkError 属性，这表明客户端发现了一些严重的问题。