基于 Sentry 的前端监控系统搭建

前言

随着技术这几年的发展与沉淀，线上数据指标监控也变得尤为重要，研发人员和运营人员需要对线上的产品指标有所感知，同时风险也需要及时暴露，很多公司开始自建监控系统，但对于一些定制化要求不是特别高的团队，还是有一些开源的项目较为合适的，如 Sentry 所做的是收集应用底层代码的崩溃信息，便于排查代码异常，同时也包含一些基础的性能监控以及事件上报能力，下面详细介绍下 Sentry 环境搭建的流程。

Sentry 环境搭建

注：本人基于 linux 系统进行安装，如 mac、window 等系统可以安装 Docker 软件，会附带 docker && docker-compose。

2.1 安装说明

Sentry 安装介绍

• Docker 19.03.6+
• Compose 1.28.0+
• 4 CPU Cores
• 8 GB RAM
• 20 GB Free Disk Space

2.2 docker 安装

// 安装最新的docker
sudo apt-get remove docker docker-engine docker.io
curl -fsSL get.docker.com -o get-docker.sh
sudo sh get-docker.sh
// 确认安装 Docker 成为最新的 docker
docker --version
// 若提示 Docker version 20.10.7, build f0df350 代表安装成功

2.3 安装 docker-compose

// 下载最新版的docker-compose文件
sudo curl -L https://github.com/docker/compose/releases/download/1.16.1/docker-compose-`uname -s`-`uname -m` -o /usr/local/bin/docker-compose
// 添加可执行权限
sudo chmod +x /usr/local/bin/docker-compose
// 确认安装成功
docker-compose --version
// 若提示 docker-compose version 1.28.0, build d02a7b1a 代表安装成功
// 如 docker 未启动，可使用如下命令
systemctl restart docker.service

2.4 Sentry 源码下载

源码地址：https://github.com/getsentry/self-hosted

下载安装：

// 方式1：下载最新版本资源
git clone [email protected]:getsentry/self-hosted.git
// 方式2：下载具体版本资源
curl -O https://github.com/getsentry/self-hosted/archive/refs/tags/22.9.0.tar.gz

// 安装
./install.sh

2.5 Sentry 部署

在部署过程中会提示创建账户，可以进行创建。

docker-compose up -d

Sentry 接入与使用

3.1 登录

部署成功后访问，ip + port (端口默认 9000) ，见页面如下。

登录

3.2 项目创建

项目创建

3.3 项目接入

我们这里测试创建 vue 项目，项目创建后会有如下接入引导。

项目接入

3.4 平台使用

3.4.1 语言设置

语言设置

3.4.2 问题

问题

3.4.3 性能

性能

3.4.4 仪表盘

仪表盘配置

仪表盘预览

总结

基于 Sentry 监控系统配置与使用几乎完成了，在安装过程中会有一些问题，可以尝试解决一下，也可以评论反馈，欢迎大家沟通交流。