javascript - javascript中停止抛出 "ResizeObserver loop limit exceeded"错误避免超出哨兵配额的最佳方法是什么？

Question

在我的 ReactJs Web 应用程序中，我在使用 AntTable 的页面上遇到“超出 ResizeObserver 循环限制”错误。 .我搜索了一下，据我所知，这个错误是无害的，可以忽略。而且它只发生在 Chrome 中，没有其他浏览器。但是，对我来说，这里的问题是我已经集成了 Sentry到我的应用程序来监控和处理错误。而且我的大多数用户都使用 Chrome 作为浏览器，因此我的哨兵报价如此之快。忽略此特定错误的最佳方法是什么。目前，我正在尝试找到一些好的解决方案，而不是添加脏 if。声明我的代码脚本抛出错误，以检查这是否是最初的“ResizeObserver”错误。如果有任何其他解决方案，我根本不想这样做？
如果需要，我还可以分享有关我的应用程序的任何其他详细信息 - 包括代码。
这是应用程序将捕获的错误发送到 Sentry 的函数.

  init() {
    if (env.ENV === 'production' && !this.isInitialized) {
      this.isInitialized = true;
      Sentry.init({
        release: env.REACT_APP_VERSION,
        dsn: env.SENTRY_DSN,
        beforeSend(event) {
          const { request: { url }, exception: { values } } = event;
          if (
            url.includes('login') &&
            values[0].type === 'UnhandledRejection' &&
            values[0].value.includes('Non-Error promise rejection captured with keys')
          ) {
            return null;
          }

          return event;
        },
      });
    }
  }

我尝试使用 requestAnimationFrame 应用包装代码的解决方案.但我不知道我应该如何归还它。

  init() {
    if (!this.isInitialized) {
      this.isInitialized = true;
      Sentry.init({
        release: env.REACT_APP_VERSION,
        dsn: env.SENTRY_DSN,
        beforeSend(event) {
          const resizeObserver = new ResizeObserver((entries) => {
            window.requestAnimationFrame(() => {
              if (!Array.isArray(entries) || !entries.length) {
                return null;
              }
              return event;
            });
          });
          resizeObserver.observe(document.getElementById('app'));
        },
      });
    }
  }

如果不是关于 ResizeObserver，我只需要原样返回错误。

Answer 1

你的主要问题是

What is the best way to ignore this specific error.

您正在使用 Sentry，并且希望防止报告不相关的错误以不超过配额。
在这种情况下，您应该使用 ignoreErrors在您的应用程序中初始化 Sentry 时，如下所示:

Sentry.init({
  ignoreErrors: [
    "ResizeObserver loop limit exceeded"
  ],
  // other config options
  // ...
});

有关详细信息，请参阅 Sentry 文档: https://docs.sentry.io/platforms/javascript/configuration/filtering/#decluttering-sentry
有关节省配额的更多想法，请阅读 https://blog.sentry.io/2017/03/27/tips-for-reducing-javascript-error-noise (有点老了，但大部分提示仍然适用于新的 Sentry SDK)。