前端异常监控平台Sentry安装配置使用及问题

前言：Sentry是一款开源的异常监控平台,支持各种语言的SDK，通过对应SDK可以收集错误信息和性能数据，并可以再后台web页面中查看相关信息。

官方地址：

安装说明：https://develop.sentry.dev/self-hosted/

后台使用说明：https://docs.sentry.io/product/releases/

SDK使用说明（根据需要选择平台查看对应文档）：https://docs.sentry.io/platforms/

1. 安装：Sentry本身是开源的，但官方也提供商业服务，免去自己搭建和维护，这里我只介绍自己搭建的流程。

1. 环境要求：

1. 4 CPU Cores

2. 8 GB RAM

3. 20 GB Free Disk Space

4. Docker 20.10.21

5. Docker-Compose 1.29.2

2. docker、docker-compose自行安装

因后续需要拉取大量镜像，可以使用阿里云容器镜像加速器，实测修改后速度有一定提升，但还是会出现拉取失败的情况，拉取镜像失败多重试几次一般就可以了。

3. 安装Sentry

git clone https://github.com/getsentry/onpremise

1. 在onpremise的根路径下可以看到一个install.sh的文件，执行以下命令进行部署

bash install.sh

2. 执行上面的命令后会自动执行以下步骤（其中拉取镜像会很慢，甚至失败，如果失败则多试几次，即多执行几次bash install.sh即可）

• 环境检查

• 生成服务配置

• 拉取镜像

• 构建镜像

• 服务初始化

• 设置管理员账号（可以选择跳过，后续再创建）

3. 全部执行结束后，会提示完成，然后运行以下命令

docker-compose up -d

4. 检查服务状态 docker-compose ps

5. 所有的服务都启动后就可以访问sentry后台了，后台默认端口9000，账号密码为上面安装时填写的，浏览器访问http://127.0.0.1:9000

4. 邮箱配置修改：sentry/config.yml

配置完成后执行docker-compose restart 重启服务，但我遇到有时restart不能重启所有的服务的情况，从接入SDK的客户端看到的就是会报跨域问题，这时我们需要执行

docker-compose stop //停止所有服务
docker-compose start //开启所有服务

5. Apache配置代理：为了解决跨域问题，我们可以使用Apache反向代理，配置如下：

    ServerName sentrytest.cn

        ProxyPreserveHost On
        ProxyPass / http://127.0.0.1:9000/
        ProxyPassReverse / http://127.0.0.1:9000/

6. sentry后台禁用了QQ邮箱，如需启用，请按以下步骤修改

1. 使用docker ps找到web容器并进入

docker exec -it 4455ad3b33e9 bash

2. 修改server.py（没有vim的自行按照），python3.8是我容器里python的目录，请根据实际情况修改，进入server.py，找到INVALID_EMAIL_ADDRESS_PATTERN，按照下面截图修改即可，修改后同样重启容器 docker-compose restart 。

vim /usr/local/lib/python3.8/site-packages/sentry/conf/server.py

2. 后台使用说明

1. 设置语言和时区：点击头像，找到用户设置

2. 创建项目：这里我选择vue，起个项目名字，alert为报错提醒，可以选择稍后设置，创建完成即可看到SDK对接步骤，这里给的是简单的示例，更多的使用请查看我另一篇文章sentry SDK使用

3. 问题：点击某条报错，可以看到详细报错信息

4. 性能：可以看到以下性能参数

• TPM：每分钟事务数

• FCP：首次内容绘制（浏览器第第一次开始渲染 dom 的时间点）

• LCP：最大内容渲染，代表 viewpoint 中最大页面元素的加载时间

• FID：用户首次输入延迟，可以衡量用户首次与网站交互的时间

• CLS：累计布局偏移，一个元素初始时和消失前的数据

• TTFB：首字节时间，测量用户浏览器接收页面的第一个字节的时间（可以判断缓慢来自网络请求还是页面加载问题）

• USER：uv 数字

• USER MISERY: 对响应时间难以忍受的用户指标，由 sentry 计算出来，阈值可以动态修改

5. 用户反馈：以Vue为例，当页面报错时，调用了Sentry.showReportDialog()，就会弹框让用户协助提供相关信息，用户输入后就可以在后台看到对应反馈

6. 警报：如下图中设置当一个新的问题被创建时，给sentry团队成员发送邮件提醒

• WHEN：需要监听的事件类型

• IF：当满足WHEN时，再检查一遍IF，过滤掉不需要的问题

• THEN：当满足触发和条件筛选时应该做的事情