为了定位线上问题,前端和客户端很类似,需要进行一些异常收集工作。 通过定位到错误的位置以及错误出现的上下文,可以解决潜在的bug。
现状
现行有一些已经开源的前端异常监控库,如腾讯的badJs,全栈js监控fundebug,国外的sentry等。
原理
监听window下的onerror事件,然后进行一定的上报设计。 也可以对库(jquery等)和方法(setTimeout等)进行封装,具体参考badJs实现。
系统设计
系统设计需要考虑的问题主要有以下几点:
- sdk实现:错误拦截,代理监控,上报策略,API设计,以及日志接口
- 上报日志的可视化后台以及实时查询
- 压缩后的js文件怎么定位问题 -- source map
推荐文章
- 前端异常监控系统的落地--Git Chat 或者 前端异常监控系统的落地--知乎:详细介绍了整个前端异常监控系统的设计
- 如何做前端异常监控?:知乎问答
- 前端代码异常监控:对比了异常收集的两种方法: onerror和try catch