Sentry 平台升级记录

本文不涉及 Sentry 平台搭建流程,只介绍在项目中如何切换至新版本
Sentry v9.0.0 -> Sentry v23.6.2

为什么使用新版 Sentry

每周都有统计 Sentry 问题的需求,但是在旧版的 Senrty 中没有看板页面,不能统一查看所有项目问题,不太方便

新版 Sentry 解决了这个问题,在侧边的 Issues 模块下,汇总了当前用户所有项目的问题,且可以通过条件过滤自己想要查看的问题

升级改动

数据上报配置

Sentry 平台

  1. 创建项目,会自动生成对应项目的 DSN(客户端密钥)

项目

  1. 修改上报的 DSN,CI 中配置 token、url、org
    1. token:可以为最高权限用户 token,如果需要更细粒度的区分组别和项目,可以再使用对应用户的 token
    2. url:新 Sentry 项目的域名
    3. org:组织设置中的名称
  2. 修改使用的上报库:@sentry/react(react 项目使用)
  3. 可选配置
    1. 性能:在 Sentry.init() 初始化的 integrations 参数中,增加 [new Sentry.BrowserTracing()],并按需设置采样率参数 tracesSampleRate,即可使用 Sentry 中的性能分析功能(这个功能比较实用,可以查看生产环境中的实际性能,更多使用方法可以查看官方文档)

告警配置

简单的项目问题的告警流程为:

graph TB A(项目数据) -- 上报 --> B[Sentry 平台] B[Sentry 平台] -- WebHooks --> C[钉钉,企业微信等通信软件] C[钉钉,企业微信等通信软件] -- 消息提示--> e(结束)

新版本 Senrty 中需要给每个项目创建对应的 Alert 规则,才能捕获错误,并通过 WebHooks 发送

Sentry 平台

  1. 开启集成中的 WebHooks,填写对应 Callback URLs 地址
  2. 创建上报告警规则
    1. 在项目右侧点击 Create Alert,或者直接在侧边的 Alerts 中打开(然后选择 Create Alert)
    2. 进入后默认会选中创建 issues,直接点击 Set Conditions
    3. 选中内容
      1. When:不选,默认满足 when 条件,也就是说,所有的问题都会满足这个条件
      2. If :不选
      3. Then:触发后的动作,选择最后一个,默认发送 webhooks
    4. 设置执行速率限制 5 min(最小值)
      1. Sentry 只执行在速率限制期限内尚未针对该问题执行的动作。例如,如果一个问题在一分钟的时间内多次满足警报条件,但是您的频率阈值是一分钟,那么你只会收到一次警报。

项目

  1. 项目上报修改,captureException 中需传入 Error 的实例,才可以在 Sentry issue 内容的标题中展示对应的问题,否则为 <unknown>
    1. 也可以使用 captureMessage 直接上报字符串

参考文档

  1. 终于搞清楚了 Sentry Issues 页面几个重要的内容 - 掘金
  2. Sentry 监控 - Alerts 告警 - 掘金
相关推荐
ZC跨境爬虫8 小时前
跟着 MDN 学 HTML day_9:(信件语义标记)
前端·css·笔记·ui·html
前端老石人8 小时前
HTML 字符引用完全指南
开发语言·前端·html
幼儿园技术家8 小时前
前端如何设计权限系统(RBAC / ABAC)?
前端
前端摸鱼匠10 小时前
Vue 3 的v-bind合并行为:讲解v-bind与普通属性合并的规则
前端·javascript·vue.js·前端框架·ecmascript
REDcker10 小时前
浏览器端Web程序性能分析与优化实战 DevTools指标与工程清单
开发语言·前端·javascript·vue·ecmascript·php·js
donecoding12 小时前
一个 sudo 引发的血案:npm 全局包权限错乱彻底修复
前端·node.js·前端工程化
风骏时光牛马12 小时前
Raku正则匹配与数据批量处理实操案例
前端
nbwenren12 小时前
2026实测:Gemini 3 镜像站视觉能力实践——拍照原型图,一键生成 HTML+CSS 代码
前端·css·html
Lee川12 小时前
Prisma 实战指南:像搭积木一样设计古诗词数据库
前端·数据库·后端