Sentry通过初始化注入全局钩子捕获异常,核心机制包括:1. 自动注册error、unhandledrejection等监听器;2. 异常触发后构造标准化Event并解析堆栈;3. 经beforeSend处理后由Transport模块上报;4. 结合Breadcrumbs与Scope增强上下文。

要实现 JavaScript 异常监控,Sentry 是目前最主流的前端错误收集工具之一。理解其源码机制有助于我们更好地集成、定制甚至优化异常上报流程。
初始化与全局钩子注入
Sentry SDK 在初始化时会自动挂载多个异常捕获钩子,核心逻辑在 Client 和 Hub 模块中处理。通过调用 Sentry.init(),SDK 会注册以下全局监听器:
-
error 事件:监听
window.onerror,捕获未处理的运行时错误(包括脚本加载错误) - unhandledrejection:监听 Promise 未捕获的 reject 错误
- captureException / captureMessage:提供手动上报接口
这些监听器统一通过 Integration 机制注册,例如 GlobalHandlers 这个内置 Integration 负责绑定上述事件。
异常拦截与事件构造
当异常触发时,Sentry 不直接发送数据,而是先进行标准化处理。核心流程位于 eventProcessor 和 integration 中:
立即学习“Java免费学习笔记(深入)”;
- 原始错误对象被包装成 Sentry 的 Event 结构,包含 message、exception、stacktrace、breadcrumbs 等字段
- 调用 normalize 流程,清理循环引用并限制嵌套深度
- 通过 beforeSend 钩子允许开发者过滤或修改事件内容
堆栈解析依赖 StackParser,它使用正则匹配浏览器的 stack 字符串,并结合 source map 解析原始文件位置(需配置 sentry-cli 上传 sourcemap)。
数据上报与队列管理
构造完成的事件通过 Transport 模块发送。默认使用 fetch 或 XMLHttpRequest 发送到 Sentry 的 ingest 接口:
- 请求携带认证信息(如 sentry_key)和项目 DSN
- 支持离线缓存(通过
OfflineTransport或本地存储临时保存) - 可设置采样率(
sampleRate)控制上报量
Transport 层抽象了网络细节,便于替换为 Beacon、WebSocket 等方式。
上下文增强:Breadcrumbs 与 Scope
Sentry 通过 Breadcrumbs 记录用户操作轨迹(如点击、路由变化),帮助复现错误场景。这些数据由对应 Integration 自动采集(如 TryCatch 监听 DOM 事件)。
Scope 提供了上下文隔离能力,允许临时附加用户信息、标签或额外数据:
scope.setUserInfo({ id: '123', email: 'user@example.com' });每次 captureException 都会合并当前 Scope 的上下文,提升排查效率。
基本上就这些。掌握这些核心机制后,可以更灵活地定制错误收集策略,比如按环境过滤、延迟上报、或结合性能监控做联动分析。










