异常监控 sentry

https://www.lxchuan12.cn/sentry/#captureevent

1、文章介绍了常用的异常捕获方式 

同步类型：

try catch

window.onerror

异步类型：

Promise.catch

Window. onunhandledrejection

资源类型：

element.onerror

performance.getEntries()进行分析

这些error事件不会向上冒泡到window，但能被window.addEventListener在捕获阶段捕获。

但这里需要注意，由于上面提到了addEventListener也能够捕获js错误，因此需要过滤避免重复上报，判断为资源错误的时候才进行上报。）

2、上报原理

Ajax 或者 img 对象进行上报（据说是主流方式，原因查到的有1、避免重复上报 2、所有浏览器都支持 Image 对象 3、避免库本身的问题）

3、sentry-javascript库的基本思路

sentry使用的是window.onerror、window.onunhandledrejection，以及支持用户的主动上报。

用fetch（backup xmr）进行上报。

4、sentry-javascript库的基本源码分析

A.从 sentry 的初始化逻辑作为入口，分析client 与 hub 的构造过程。

b.BrowserBackend继承自BaseBackend，继承过程实现抽象的_setupTransport方法。从而提供了请求相关的功能实现。BrowserClient继承自BaseClient(BrowserBackend)，通过实例化BrowserClient可以得到一个拥有发送请求等能里的client实例。

d.从getCurrentHub分析hub实例对象的构造，hub的构造采用了单例，从初在全局对象的__sentry__.hub  上，主要包含的属性有scope和client。client及上文提到的BrowserClient的实例。scope主要通过暴露的api，供用户设置一些全局的信息。如setExtra，setUser等。

e.最后分析了两个主要apicaptureMessage与captureEvent在源码中的完整运行流程。

总的来看，sentry-javascript  源码中大量使用了继承从而实现了基类功能抽象和不同端的具体功能实现。整体并没有太复杂。