如何在Sentry中正确忽略Unhandled [object XMLHttpRequest]事件？

我在Sentry的问题报告里发现大量Unhandled [object XMLHttpRequest]事件，排查后发现这类异常发生前都会调用https://px-eu.dynamicyield.com/clog的XHR请求，且状态码为0。我尝试用beforeSend钩子匹配面包屑和错误信息来忽略这类事件，但部署后问题依旧。代码如下：

Sentry.init({
        beforeSend(event, hint) {
            const error = hint.originalException;
            const failingDYApiBreadcrumb = event.breadcrumbs.find(
                (breadcrumb) =>
                    breadcrumb.category === 'xhr' &&
                    breadcrumb.data?.url ===
                        'https://px-eu.dynamicyield.com/clog' &&
                    breadcrumb.data?.status_code === 0,
            );
            if (
                error?.message?.match(/object XMLHttpRequest/i) &&
                failingDYApiBreadcrumb
            ) {
                return null;
            }
            return event;
        },
    });

你的方案存在的问题 #

1. URL匹配过于严格：Sentry生成的XHR面包屑中，data.url可能不是完整的绝对路径（比如被处理成相对路径、或包含额外参数），全量匹配绝对URL容易导致匹配失败。
2. 状态码字段不兼容：部分Sentry版本中，XHR面包屑的状态码字段是status而非status_code，直接指定status_code会漏掉符合条件的面包屑。
3. 错误信息匹配覆盖不全：hint.originalException可能不是标准Error对象，message字段可能不存在；同时异常信息也可能存储在event.exception.values[0].value中，仅匹配originalException.message会有遗漏。

修正后的解决方法 #

方法一：优化beforeSend逻辑 #

放宽匹配条件，兼容不同字段情况，同时覆盖更多错误信息存储位置：

Sentry.init({
  beforeSend(event, hint) {
    // 匹配目标错误信息：覆盖原始异常和事件中的异常描述
    const hasXMLError = 
      (hint.originalException?.message?.includes('[object XMLHttpRequest]') || 
       event?.exception?.values?.[0]?.value?.includes('[object XMLHttpRequest]'));

    // 匹配目标失败请求：用包含匹配URL，兼容status/status_code字段
    const hasFailingDYRequest = event.breadcrumbs.some(breadcrumb => {
      return breadcrumb.category === 'xhr' && 
             breadcrumb.data?.url?.includes('px-eu.dynamicyield.com/clog') && 
             (breadcrumb.data?.status === 0 || breadcrumb.data?.status_code === 0);
    });

    if (hasXMLError && hasFailingDYRequest) {
      return null; // 忽略该事件
    }
    return event;
  },
});

方法二：使用Sentry后台过滤规则 #

无需修改代码，直接在Sentry项目后台配置规则：

• 进入项目「设置」→「过滤规则」→「创建规则」
• 添加条件：「错误信息包含[object XMLHttpRequest]」+「面包屑URL包含px-eu.dynamicyield.com/clog」
• 设置动作：「丢弃事件」

方法三：在请求层面捕获错误 #

在发送目标XHR请求的代码中，手动捕获错误并阻止全局抛出：

const xhr = new XMLHttpRequest();
xhr.open('POST', 'https://px-eu.dynamicyield.com/clog');
// 仅处理该请求的错误，不向上抛出
xhr.onerror = function() {
  console.debug('DY clog请求失败，已忽略');
};
xhr.send();

内容的提问来源于stack exchange，提问作者karo-s