前端錯誤監(jiān)控平臺sentry搭建及接入

前言

sentry是時下不可多得的一款保證項目質量與健康的監(jiān)控工具庐舟,受到開發(fā)團隊青睞。具有以下突出特點:

  • 利用sourcemap還原源碼姜钳,精確定位錯誤堆棧
  • 保留現(xiàn)場記錄錯誤發(fā)生時的用戶行為
  • 配置郵件預警策略和閾值實時提醒
  • 數(shù)據(jù)統(tǒng)計報表

Server安裝

官方最新版推薦使用Docker安裝拭抬,要求Docker 17.05.0+吟逝,Compose 1.19.0+,另外推薦Python版本為2.7占业,docker安裝這里不再多述,使用下述命令確認是否已安裝及版本:

docker -v
docker-compose -v

拉sentry安裝代碼到本地:

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

執(zhí)行腳本一步到位:

cd onpremise
./install.sh

啟動相關容器:

docker-compose up -d

期間有交互可設置admin賬號绒怨,最后瀏覽器輸入地址纯赎,默認端口為9000谦疾,安裝完成
值得注意的地方是sentry有一份配置文件config.yml放在onpremise/sentry里,安裝前可以預先修改配置項犬金。如果安裝后再想修改配置請遵循以下步驟:

已配置smtp郵件服務為例念恍,強烈推薦修改六剥,不然默認可能會當作垃圾郵件或收不到郵件,找到config.yml如下位置峰伙,
image.png

再已企業(yè)微信郵箱為例:
# mail.backend: 'smtp'  # Use dummy if you want to disable email entirely
mail.host: 'smtp.exmail.qq.com'
mail.port: 587
mail.username: 'ab@cd.com'
mail.password: 'xxxx' // 密碼不是企業(yè)微信的登錄密碼疗疟,而是 設置–微信綁定–安全登錄–客戶端專用密碼
mail.use-tls: true
# The email address to send on behalf of
mail.from: 'ab@cd.com'

保存config.yml,在onpremise目錄瞳氓,執(zhí)行:

docker-compose build
docker-compose run --rm web upgrade
docker-compose up -d

項目接入sentry

  1. 在sentry平臺新建project策彤,會有接入提示
  2. 項目中執(zhí)行:
npm install @sentry/browser --save
  1. 項目入口文件添加代碼:
import * as Sentry from '@sentry/browser';

Sentry.init({dsn: "http://序列號@ip地址:9000/數(shù)字"});

運行項目,如有報錯信息就可以在sentry平臺中搜集到匣摘。

項目上傳sourcemap

  1. 項目中執(zhí)行:
npm install @sentry/webpack-plugin --save-dev
  1. 添加webpack插件店诗,類似代碼:
new SentryWebpackPlugin({
  include: './build', // 代碼生成位置
}
  1. 根目錄創(chuàng)建.sentryclirc文件,內(nèi)容:
[defaults]
url = url地址
org = 組織名
project = 項目名

[auth]
token = 授權令牌 

授權令牌再網(wǎng)站獲取音榜,勾選project:write:


image.png

image.png

webpack打包時會自動上傳目錄下的所有.map文件到sentry服務器上庞瘸,前提是要生成sourcemap文件,如遇權限問題赠叼,可查看掛載位置:

docker inspect sentry-data
image.png
cd /home/data/docker/volumes/sentry-data/_data
chmod 777 .
cd files
chmod 777 -R .

上傳成功后擦囊,就可以在平臺上看到對應版本的錯誤源碼了。

配置

為了方便使用嘴办,可以先設置語言和時區(qū):


image.png
最后編輯于
?著作權歸作者所有,轉載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末瞬场,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子涧郊,更是在濱河造成了極大的恐慌泌类,老刑警劉巖,帶你破解...
    沈念sama閱讀 216,544評論 6 501
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件底燎,死亡現(xiàn)場離奇詭異刃榨,居然都是意外死亡,警方通過查閱死者的電腦和手機双仍,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,430評論 3 392
  • 文/潘曉璐 我一進店門枢希,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人朱沃,你說我怎么就攤上這事苞轿。” “怎么了逗物?”我有些...
    開封第一講書人閱讀 162,764評論 0 353
  • 文/不壞的土叔 我叫張陵搬卒,是天一觀的道長。 經(jīng)常有香客問我翎卓,道長契邀,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 58,193評論 1 292
  • 正文 為了忘掉前任失暴,我火速辦了婚禮坯门,結果婚禮上微饥,老公的妹妹穿的比我還像新娘。我一直安慰自己古戴,他們只是感情好欠橘,可當我...
    茶點故事閱讀 67,216評論 6 388
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著现恼,像睡著了一般肃续。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上叉袍,一...
    開封第一講書人閱讀 51,182評論 1 299
  • 那天痹升,我揣著相機與錄音,去河邊找鬼畦韭。 笑死疼蛾,一個胖子當著我的面吹牛,可吹牛的內(nèi)容都是我干的艺配。 我是一名探鬼主播察郁,決...
    沈念sama閱讀 40,063評論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼转唉!你這毒婦竟也來了皮钠?” 一聲冷哼從身側響起,我...
    開封第一講書人閱讀 38,917評論 0 274
  • 序言:老撾萬榮一對情侶失蹤赠法,失蹤者是張志新(化名)和其女友劉穎麦轰,沒想到半個月后,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體砖织,經(jīng)...
    沈念sama閱讀 45,329評論 1 310
  • 正文 獨居荒郊野嶺守林人離奇死亡款侵,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 37,543評論 2 332
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現(xiàn)自己被綠了侧纯。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片新锈。...
    茶點故事閱讀 39,722評論 1 348
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖眶熬,靈堂內(nèi)的尸體忽然破棺而出妹笆,到底是詐尸還是另有隱情,我是刑警寧澤娜氏,帶...
    沈念sama閱讀 35,425評論 5 343
  • 正文 年R本政府宣布拳缠,位于F島的核電站,受9級特大地震影響贸弥,放射性物質發(fā)生泄漏窟坐。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點故事閱讀 41,019評論 3 326
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望狸涌。 院中可真熱鬧,春花似錦最岗、人聲如沸帕胆。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,671評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽懒豹。三九已至,卻和暖如春驯用,著一層夾襖步出監(jiān)牢的瞬間脸秽,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 32,825評論 1 269
  • 我被黑心中介騙來泰國打工蝴乔, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留记餐,地道東北人。 一個月前我還...
    沈念sama閱讀 47,729評論 2 368
  • 正文 我出身青樓薇正,卻偏偏與公主長得像片酝,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子挖腰,可洞房花燭夜當晚...
    茶點故事閱讀 44,614評論 2 353

推薦閱讀更多精彩內(nèi)容