所谓web，就算你我素不相识，也知道志趣相投；足不出户，你就会知道世界的大小。最近接到一个用户的需求场景。当JavaScript出现异常错误时，如果我们能记录下错误发生前的鼠标点击、页面跳转、网络请求、控制台打印等信息，就能更快的带你回到网站。“沉船”场景。我觉得这个想法很好，那加入我们的前端监控怎么样？目前我实现了一套解决方案：一键还原错误代码和错误场景还原。如果你有更好的解决方案，一定要联系我！一键还原错误代码目前开发的前端项目大多会使用前端工程打包工具，如gulp、grunt、webpack等，最终编译后的代码会对源码进行混淆压缩。在实际线上项目中，js抛出的错误信息往往是压缩后的位置和变量信息，导致我们需要花更多的时间去寻找问题的实际位置，那么如何解决这个问题呢？当我们使用各种压缩工具时，我们可以生成*.map文件。简单的说，sourcemap就是一个存储位置信息的信息文件。也就是说，转换后代码的每个位置都对应转换前的一个位置。有了它，很多工具会直接显示原始代码，而不是转换后的代码。下面看一下我们前端监控的实现：1.入口2.堆栈信息，在左边右边输入错误文件的行列号，上传*.map文件，点击开始解析，解析成功后，会在下表中显示询问错误文件的原名，行列号等，下面小编可以查看对应的错误位置，方便大家快速定位错误。错误场景还原通过一键还原错误代码，我们可以找到错误的位置，但是对于一些错误，我们可能还是需要知道用户在做什么，发生错误之前发生的一些事情，这样我们才能判断错误是如何更快发生的，我们继续看如何实现：用户报错后，我们可以回溯到当前时间点之前用户的页面跳转和HTTP请求相关信息，然后根据到时候生成一个完整的访问请求链，将这些信息串联起来，这就是当前用户的“崩溃场景”。最后介绍：喜欢的话请点个赞或者去https://github.com/kisslove/w...Star或者打赏或者...哈哈，我的想法很多。
