前言今年公司有一个项目交付给用户。在使用的过程中，您会发现会有很多不可预知的因素。你无法想象用户会拥有什么。这样的操作会导致各种神奇的错误。往往这个时候我们就不容易复现场景，需要用户截图描述场景，然后我们开发人员再复现场景，然后排查修复bug，效率很低。这时候我就在想，有没有这样一个插件，可以自动监测用户的行为轨迹，报错时自动将用户的行为轨迹和错误信息上传到服务器呢？于是在网上搜索轰炸，发现了很多开源或者收费的前端监控平台，比如：sentry：从监控错误，错误统计图表，多标签过滤和标签统计到触发告警，这一套非常完整。团队项目需要收费，数据量越大，钱越贵fundebug：除了监控错误，还可以录屏，即记录用户在开始前几秒的所有操作发生错误。压缩后的体积只有几十KB，但是操作有点繁琐。webfunny：还包括监控错误的功能，可以支持千级万级的日PV量，额外亮点是远程调试，性能分析，docker私有化部署（免费），业务代码已经加密，但是总感觉比我想要的差一点点，直到我无意中看到这样一张照片：对，就是这样！mitojsmitojsmitojs是大佬开源的前端监控SDK。目前适用于Vue和React。github地址在这里：https://github.com/clouDr-f2e/Mitojs主要通过重写部分native方法，增加全局点击事件监听，实现用户行为监控和错误信息的及时发送。双手奉上在线体验地址：https://static.91jkys.com/web/mito-vue-demo/#/demo/one看到这里，我怎么忍心，立马新建一个项目，并体验飞翔的感觉。使用mitojs效果图先看一下效果图。我们可以看到，当项目报错时，会调用上传接口上传信息，包括用户的行为轨迹和当前的错误信息。是不是很不错！！下面介绍一下简单的用法，下面是基于Vue的用法。如何使用使用npm安装npmi@zyf2e/mitojs-S参考插件importMITOfrom'@zyf2e/mitojs'importVuefrom'vue'Vue.use(MITO.MitoVue)MITO.init({dsn:'http://test.com/error',//错误信息上传接口地址apikey:'123-2223-123-123',//每一项对应一个apikey，用于存放错误集合的唯一标识backTrackerId(){returnString(Math.random()*1000)}})然后愉快地使用它。其他配置项请参考使用手册：https://github.com/clouDr-f2e/mitojs/blob/master/docs/guide.md
