基于rrweb框架，搭建前端技术运营监控体系的实践分享

基于 rrweb 框架，搭建前端技术运营监控体系的实践分享

摘要

在工程化的前端项目中，通常使用webpack进行打包优化并上线。打包后的产物经过压缩和优化，对于一般开发者来说难以理解。当这样的产物交付到线上生产时，由于生产环境的状态是不可监控的，且代码已被压缩，导致如果发生前端js报错，报错信息无法准确地映射到源代码中的具体位置，从而给问题的定位带来了很大的挑战。因此，迫切需要一种前端监控手段来记录和收集这些报错，以便快速定位问题。

为了实现前端监控和快速定位问题，必须解决各种类型的数据记录、收集和监控，例如js报错、接口报错、文件加载报错、用户行为等。同时，如果要实现实时的视频回放能力，还需要解决视频文件过大不方便保存和上传的问题。本方案的目标就是解决这些问题，实现前端全方位的监控。