微信小程序错误监控方法谈

对于小程序开发者来说，如何进行错误监控一直是个头疼的问题。由于小程序开发迭代较快，会存在系统问题，机型问题和版本的兼容问题，有时候我们在自行测试中完美运行，可总是有用户抱怨使用异常。如果我们对小程序的错误进行有效的监控，可以帮助小程序开发者发现异常，优化代码，用户体验也会随着优化逐步的提升。

作为一个小程序开发者，如果你对前端开发比较熟悉，那么在错误监控方面可能会更快的上手。因为小程序错误监控和 Web 端错误监控本身就具有很多相似性，因此监控的数据规则基本是一致的，但由于小程序自身的特性，在错误监控方面会有以下不同：

• 在 Web 端我们监测的是页面完整的url，而小程序端监测的是路由地址；

• 小程序页面属于微信内部的页面，使用时已全部加载完毕，因此监控页面性能时不统计页面加载时长等信息，更多的是对页面内请求、资源请求和用户行为的监控；

• 由于微信官方和小程序代码的要求，集成方式对比 Web 端会相对严格一些。

---

根据以上的相同点和不同点，我们可以整理出对于小程序而言，哪些数据是需要监控的：

• JavaScript异常监控：不论是 Web 端还是小程序端，对JavaScript异常的监控都是必要的；

• 页面内请求监控：对于小程序来说，我们需要统计发送网络请求的wx.request()异常时的请求状态、请求时长、请求地址等；

• 资源加载监控：当需要下载资源到本地的wx.downloadFile() 出现异常时，统计加载时间、异常类型、资源地址等；

• 页面性能监控：访问监控、页面来源及流向监控等，方便我们更好的对小程序进行运营；

• 用户数据统计：用户的分布、操作系统及版本、微信版本、IP 地址等，给错误的分析提供更多条件。

对于小程序出现的错误，我们目前只能在开发者工具上进行追踪和调试，有条件的开发者也可以选择在真机上进行调试，但是小程序大多还是小团队和个人开发者，拥有不同操作系统，不同型号，不同版本的真机进行调试还是不太现实，这里就可能会出现在本地调试中没有出现的问题，且很难定位的到。

在目前的微信小程序后台中，对于上面后两点的监控和统计已经可以实现，用户数据的分析也比较完善，但是对于错误的监控目前还无法实现，这里我们可以借助第三方工具来进行对错误的监控。

这里我们选择错误监控平台 FrontJS 的小程序错误监控：www.frontjs.com/

FrontJS 的小程序错误监控相比于微信小程序后台的数据监控，增加了对于错误的统计和产生错误的相关用户分析，FrontJS可以收集精细到console.log级别的任何JavaScript异常信息并提供 stack trace 信息；对于任何一条错误信息或访问，它都会统计到该用户的IP、屏幕分辨率、DPR、操作系统类型和微信版本，方便我们更有针对性的去调试出现的错误。

使用时我们只需引入 FrontJS 插件，并添加配置代码，即可开启监控。

具体方法：

• 进入 FrontJS 后注册账号，登陆后选择创建项目，在创建项目页面的名称后选择“微信小程序”。

在这个页面也可以对不监听的资源和信任域进行设置。

创建完成后，我们只需要根据页面右侧的提示进行操作，就可以完成小程序错误监控的全部设置。

集成完毕后就可以开始错误的监控了，具体界面如下，在左侧菜单栏中我们可以选择不同的条件进行错误的筛选，具体内容各位可以亲自尝试。

FrontJS对微信小程序下已有的相关方法进行了监听，在出现异常或需要监控时，FrontJS会及时发现并统计数据，并且完全不影响小程序的正常运行。

在后续更新中，FrontJS 会继续挖掘可监控到的信息，如用户的位置信息，语言，基础库版本等，对这些信息做更优处理，配合可视化工具，开发者将可以构建出更符合自身需求的数据方案。