前端错误监控 Sentry

1.Linux安装Sentry

我这里用的是阿里云服务器:CenterOS7.8,CUP1核,内存4G。

步骤:
1、 [CenterOS安装Docker]
2、[docker配置阿里镜像] 这步很重要,速度不知道快了多少
3、安装docker-compose 官网地址:https://docs.docker.com/compose/install/
太慢了,我这里用phyon装的
看这里https://blog.csdn.net/u010381752/article/details/90295010

1
2
yum install -y python-pip
pip install docker-compose

4、看 github上的文档 onpremise,如下图(【这步很重要】,就是这里看到的最低需要2400MB RAM):

5、执行:

1
2
git clone https://github.com/getsentry/onpremise.git
cd onpremise

6、 创建配置文件

1
2
cp -n config.example.yml config.yml
cp -n sentry.conf.example.py sentry.conf.py

7、配置邮箱

onpremise/sentry下,找到conf.yml配置如下:

[注意]

  1. 这里的mail.frommail.username一样,都是邮箱地址

  2. mail.password是邮箱的授权密码,登录邮箱去POP3/SMTP/IMAP设置下开启服务获取密码即可。

8、执行:

1
./install.sh  # 这步比较慢,耐心等待

创建成功,中间会让你输入是否创建新账号,输入邮箱和密码。
成功之后会出现

1
2
3
You're all done! Run the following command to get Sentry running:

docker-compose up -d

最后

1
docker-compose up -d

Sentry服务器跑起来了。

9、去阿里配置可访问端口:
进入到当前实例-安全组配置-右上角选择旧版,因为新版我没有找到可以配置端口范围的地方,配置内容如下:

好了之后就可以直接用浏览器打开 ip:9000 ,登录之后需要配置邮件服务的账号密码登录(上面配置过的应该不用了),如果之前config中没有配置,这里会显示,就配置一下。
完成~

2. 玩转Sentry

基础配置完成,进入到Sentry界面。

2.1 接入邮件|钉钉服务

onpremise/sentry/config.yml已经配置了邮件信息的基础上,打开Sentry界面,manage/status/mail/下 按钮Send a test email to XXX,报

1
Connection unexpectedly closed: timed out

安装插件django_smtp_ssl

1
pip install django-smtp-ssl

配置onpremise/sentry/config.yml

1
mail.backend: 'django_smtp_ssl.SSLEmailBackend'

配置onpremise/sentry/requirements.txt

1
2
3
# Add plugins here
sentry-dingtalk-new # 钉钉通知插件
django-smtp-ssl~=1.0 # 发邮件支持SSL协议

重新启动

1
2
./install.sh
docker-compose up -d

点击测试按钮,再发送测试邮件就能发送成功了。

测试邮箱如上图能够发送成功,但是我本地测试了一下,当项目中报错时,错误日志信息已经发送到Sentry服务,但是并没有发送邮件。(我又点了发送测试邮件的按钮,能够发送邮件)

配置钉钉:看这个步骤https://my.oschina.net/u/4290244/blog/3349141
获取自定义钉钉webhook https://ding-doc.dingtalk.com/doc#/serverapi2/qf2nxq

【邮箱、钉钉一样,测试都能发送消息,实际项目中报错的时候都不能发送。】

邮箱一直能收到测试邮件….

1
[This is an example Python exception] This is an example Python exception http://xxx.xxx.xxx.xxx:9000/organizations/sentry/issues/7/

点钉钉的测试按钮,机器人也能自动发送消息….

针对测试邮件能够发送,报错邮件不能发送问题https://blog.csdn.net/github_38281308/article/details/106905367,查看这个发型可能跟docker有关,待研究docker

2.2 性能分析

2.3 SourceMap

生产环境打包后的代码,快速定位到源码。

1、 安装插件
yarn add @sentry/webpack-plugin --dev

2、根目录下新建 .sentryclirc,配置如下

1
2
3
4
5
6
[defaults]
url = http://xxx.xxx.xxx.xxx:9000/
org = sentry
project = react
[auth]
token = xxxxxxxxxxxxxx

① url是sentry上报的网址
② ③如下图

④ token就是 API keys,Auth Tokens 新建一个令牌(注意生成token的时候要勾选 project:write 选项)

3、配置插件参数
生产打包webpack配置:

1
2
3
4
5
6
7
new SentryPlugin ({
release: "production@1.0.1",//版本号
include: path.join(__dirname,'../dist/'), //需要上传到sentry服务器的资源目录,会自动匹配js 以及map文件
ignore: ['node_modules'], //忽略文件目录,当然我们在inlcude中制定了文件路径,这个忽略目录可以不加
configFile :'.sentryclirc',
urlPrefix : "~/" // 线上对应的url资源的相对路径 比如我的域名是 http://XXX .com/,静态资源都在 static文件夹里面,
})

webpack打包之后可以在Sentry服务端->版本 一栏查看到版本号 1.0.1

4、配置Sentry dns参数

1
2
3
4
Sentry.init({
dsn: "http://73779960f3a74f4b893f54b81b386020@121.40.178.235:9000/2",
release: "production@1.0.1" // 这个版本号与上一步一致
});

5、 配置devtool

1
devtool:isDev?'eval-cheap-module-source-map' : 'nosources-source-map', // 'source-map'


从打包时间来看,nosources-source-map 耗时 58s左右,source-map 耗时 20s左右,可看具体需求配置。

这样的话基本 source map配置就结束了,有几个问:

1) @sentry/wepback-plugin 配置之后,打包之后的代码带.map文件,不能自动删除,部署到服务器时的时候需要手动删除。
2) 生产打包时同一个版本传到Sentry,.map和.js文件会一直追加,文件越来越多,需要手动删除。

解决方案:可以尝试用webpack-sentry-plugin插件代替,上传完之后可自动删除.map文件且可以过滤.js文件不上传到Sentry服务器上,但是我没配成功….

5、 配置 environment (可选)

入口文件配置更改如下:

1
2
3
4
5
Sentry.init({
dsn: "http://xxxxx@xxx.xxx.xxx.xxx:9000/x",
release: "production@1.0.3",
environment: 'env_react1', // process.env.NODE_ENV 可以在Sentry->版本->环境区分
});

配置了environment之后,可以在Sentry服务后台左侧版本菜单下查看,同一版本的还是放在一个版本下面,然后可以用环境进行区分

3. 旧版报错方案

这部分的报错过程都是按照 [Linux下搭建Sentry] 这种方式安装的,没有仔细看 onpremise github文档导致的~记录下,毕竟装的时候太折磨了…

  1. [dial tcp: lookup production.cloudflare.docker.com]
  2. [docker启动失败报错:Failed to start docker.service: Unit is not loaded properly: Invalid argument]
  3. [ERROR: Service ‘sentry-cleanup’ failed to build: pull access denied for sentry-onpremise-local, repository does not exist or may require ‘docker login’: denied: requested access to the resource is denied],执行docker-compose build --pull --force-rm web
  4. [FAIL: Expected minimum RAM available to Docker to be 2400 MB but found 1991 MB]

安装完成之后 docker login登录一下,之后可能会有一些权限报错。