2017/4/6StackEdit–Editorhttps://stackedit.io/editor1/11前端异常监控系统的落地背景在后端服务中，错误或者业务日志的记录是非常常见的一种习惯，它可以帮助开发者快速定位系统的状态、追查bug，了解异常情况等。但是反观前端开发领域，成型的日志或者监控系统就非常的少见。那么如何在自己公司自主搭建一款适合自己的业务需要的前端异常监控系统呢？本文就是一个实际项目落地的过程总结。问题之前百姓网Team的刘小杰同学出了一篇《浏览器端JavaScript异常监控》前端的分享和文章。描述了整个监控体系的实现方案，以及未来可能需要解决的一些问题。没有读过的小伙伴强烈推荐看完我这篇文章再去看一下这个分享。其实很多公司都有这个方面的尝试，包括一些开源的解决方案，比如腾讯的badjs，淘宝的JSTracker，阿里巴巴的FdSafe，支付宝的saijs，国外的sentry和对应的前端sdkravenjs，包括对应的TraceKit，当你真正开始要动手做的时候，一大堆已有的解决方案其实早在3-4年前就已经被人提出，实现和应用了。但是他们真的是每一个人的解决方案吗，答案肯定并不是，目前主流的前端监控系统，包括一些收费服务，国内比如fundebug，产品功能和sentry还真像，只不过他只关注前端，sentry关注所有的Error收集场景，他们解决的问题其实都是本文要说到的一些通用问题，但是针对到具体项目适合不适合，就要看业务方自己选择了。到这里其实大家不难看出，前端异常监控系统的开发其实并不复杂，开源实现方案也颇多，技术实现成本并不难，痛点有但是并不是都不能解决，总结一下：1.前端SDK需要实现，主要是错误拦截，代理监控，上报策略，API设计，以及日志接口。2.上报的日志实现实时查询。3.监控日志可视化管理后台的开发。4.压缩后的单行文件如何定位源码错误。以上5点是基本，甚至后期可以再自己扩展加入短信提醒，邮件提醒等成熟的产品功能。当然这其中会充斥着一些暗坑，明坑，以及你想自己定制的业务场景，那么下面就通过这篇文章，把我们的项目经验给大家一一道来。SDK的实现GitChat2017/4/6StackEdit–Editorhttps://stackedit.io/editor2/11SDK的实现先说一些题外话，如果先不考虑他是一个report加拦截错误的SDK，当你要写一个前端SDK的时候，我们要做些什么？最好的一个思路就是先写使用文档或者入门技巧的教程，这是我百试不爽的招数，因为只有当使用教程和入门文档写到完美的时候，你再去通过编码实现对应的API，那简直是事半功倍，代码实现完都会...
