微信小程序错误监控经验谈

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

小程序的错误监控和 Web 端错误监控具有很多相似性,监控的数据规则基本是一致的,如果你是一名小程序开发者,同时对前端也很熟悉,那么在错误监控方面应该会更加得心应手,但由于小程序自身的特性,在错误监控方面会有以下几点需要注意:

  • 在 Web 端我们监测的是页面完整的url,而小程序端监测的是路由地址;
  • 小程序页面属于微信内部的页面,使用时已全部加载完毕,因此监控页面性能时不统计页面加载时长等信息,更多的是对页面内请求、资源请求和用户行为的监控;
  • 由于微信官方和小程序代码的要求,集成方式对比 Web 端会相对严格一些。

综上,我们可以整理出对于小程序而言哪些数据是需要监控的:

  • JavaScript异常监控:不论是 Web 端还是小程序端,对JavaScript异常的监控都是必要的;
  • 页面内请求监控:对于小程序来说,我们需要统计发送网络请求的wx.request()异常时的请求状态、请求时长、请求地址等;
  • 资源加载监控:当需要下载资源到本地的wx.downloadFile() 出现异常时,统计加载时间、异常类型、资源地址等;
  • 页面性能监控:访问监控、页面来源及流向监控等,方便我们更好的对小程序进行运营;
  • 用户数据统计:用户的分布、操作系统及版本、微信版本、IP 地址等,给错误的分析提供更多条件。

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

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

这里我们选择错误监控平台 FrontJS 的小程序错误监控:

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

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

具体方法:

FrontJS-轻量级的网站错误监控平台​www.frontjs.com

 

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

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

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

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

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

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

共有 0 条评论

123