公司生产环境项目中，会有js异常报错情况，为了监控前端代码异常，所以搭建并记录sentry落地过程。 sentry落地内容包括： 注册GeoIP账号 在linux服务器上使用self-hosted搭建

我们平常收集错误，大部分人、公司都采用的Sentry来收集，当然也有好多公司也有自研的前端监控。趁着最近我们组刚好要接入Sentry，并且要根据自己的调研来做一次分享。所以就总结出了下面的内容。

一个完整的前端监控平台包括三个部分：数据采集与上报、数据整理和存储、数据展示。 本文要讲的就是其中的第一个环节——数据采集与上报。下图是本文要讲述内容的大纲，大家可以先大致了解一下： 仅看理论知识是比

前端监控分为性能监控和错误监控。其中监控又分为两个环节：数据采集和数据上报。本文主要讲的就是如何进行数据采集和数据上报。 性能数据采集需要使用 window.performance API。 从 MDN 的文档可以看出，window.performance.timing 包含了…

俗话说，不依赖业务场景的系统设计，叫耍流氓。 构想设计这个系统也是有着业务背景的，所在公司的产品既面向 C 端，也面向 B 端。在我们开发落地业务时，经常遇到一类非常头疼的问题： 所以我决定动手撸一个监控系统，用来解决错误收集和问题回溯。让我们在追溯以往出现的问题时，能够省时省…

1. 将hash生成到文件名中 2. 将hash或时间戳放到文件url search中 3. 没有使用hash或时间戳 2. sourcemap生成 方法一. 将sourcemap文件在构建时上传到监控服务器，然后删除即可 方法二. 在服务器端使用nginx等代理服务器，对文件…

由于前端环境的复杂性， 很多时候，我们不只是需要关注用户报出的错误， 还想知道是什么情况下发送，如何复现，这时候用户轨迹就很重要了。 1. 常见实现方案 a. 业界牛选： Sentry， sentry是一款很强大的前端错误监控软件， 并且可以通过安装plugins来实现其他很多…

最近在做一个较为通用的前端性能监控平台，区别于前端异常监控，前端的性能监控主要需要上报和展示的是前端的性能数据，包括首页渲染时间、每个页面的白屏时间、每个页面所有资源的加载时间以及每一个页面中所以请求的响应时间等等。 本文的介绍的是如何设计一个通用的jssdk,可以以较小的侵入…