Sentry中上报的错误追踪
背景:
Sentry中上报的的错误日志对于前端定位问题来说帮助有限,尤其是代码行和列的提示,无法快速有效定位到具体错误的代码
原因:
前端打包后的文件经过了混淆/压缩等处理,早已和源文件的行/列不匹配。
解决方案:
- 开启线上的source-map配置(webpack配置,目前react模板库默认线上/预演是开启着的)
- 找到sentry中报错的js文件,比如截图中所示的
https://console.location.pub/static/js/main.189c3480.js
在该js文件后手动拼上.map,例如:
https://console.location.pub/static/js/main.189c3480.js.map
浏览器中回车下载该文件到本地
3.打开 https://evanw.github.io/source-map-visualization/ (有条件的翻墙使用更丝滑一些)
点击 Upload files上传按钮后,上传刚才下载的.map文件