在iOS上调用“抓取”时出现Javascript“ TypeError：canceled”错误

Question

我正在使用Sentry记录JS客户端错误，并且有很多TypeError: cancelled错误。它仅在iOS上发生。我在Google上找不到任何东西。这是本机Javascript错误还是其他？这是什么意思？

我也得到其他语言类似的错误，如???，Abgebrochen和cancelado。这告诉我该错误不是由我的代码引起的。

Answer 1

根据WHATWG标准：https://html.spec.whatwg.org/multipage/browsing-the-web.html#aborting-a-document-load，中止文档时（关闭或导航离开）将取消获取请求）。显然，浏览器的行为有所不同，因此我制作了一个工具来测试浏览器行为（如果有帮助）：https://request-cancellation-test.vercel.app（代码）。

以下是常见浏览器的测试结果：

场地	铬95	狩猎14	iOS Safari 14	火狐94
.toString()	TypeError: Failed to fetch	TypeError: cancelled	TypeError: cancelled	TypeError: NetworkError when attempting to fetch resource.
.name	TypeError	TypeError	TypeError	TypeError
.message	Failed to fetch	cancelled	cancelled	NetworkError when attempting to fetch resource.
.stack	TypeError: Failed to fetch at ...

Answer 2

令人沮丧吗？

最近我们的团队遇到了同样的错误。这是我们案例中发生的事情。当页面加载时，刷新按钮更改为十字按钮，现在如果在此页面加载期间正在进行某些 api 请求并且用户单击此十字按钮，则 iOS chrome/safari 会抛出此错误。对于相同的情况 Firefox 浏览器 throwsTypeError: NetworkError when attempting to fetch resource和 chrome 浏览器 throughs TypeError: Failed to fetch。

这实际上不是我们应该担心的问题，因此我们决定使用 sentry 的 ignoreErrors 属性使 sentry 忽略此错误。

Sentry.init({
  dsn: "sentry_dsn",
  ignoreErrors: [
    'TypeError: Failed to fetch',
    'TypeError: NetworkError when attempting to fetch resource.',
    'TypeError: Cancelled'
  ],
});

注意：
获取失败也是由 CORS 错误产生的，也请注意这一点。我们还决定使用哨兵的 beforeSend 回调忽略 400 到 426 之间的 statusCode 错误。

我们花了几天时间试图找出这个错误。希望这可以帮助某人。

谢谢

另外，这最初写在这里：https : //forum.sentry.io/t/typeerror-failed-to-fetch-reported-over-and-overe/8447/2

Answer 3

如果您使用API，则fetch可能是 iOS 11.1-12 中的问题，只有当有人尝试中止提取请求时才会触发（这就是为什么它不一定会影响所有 iOS 用户，解释了不一致的原因） ）。AbortControllerAbortSignal

详细来说，iOS 11.1-12在 DOM 中定义了AbortController和，但它们是一个存根 -请参阅此处。因此，如果您尝试在 <= 12 内中止 iOS 中的获取请求，该请求将不会中止，并且可能会引发某种错误。AbortSignal

鉴于它是 aTypeError而不是 an AbortError，问题似乎在于未AbortController正确/完全定义。

编辑： 进一步阅读似乎还表明fetchesiOS 中失败会引发TypeError错误，即使对于阻止获取之类的事情也是如此。如上所述，问题可能是安装了任何广告拦截器（例如，在越狱的 iPhone 上）或问题CORS，然后 iOS 会抛出TypeError- Webkit BugZilla 讨论。因此，专注于错误类型可能会导致您走上错误的道路。