主机参考:VPS测评参考推荐/专注分享VPS服务器优惠信息!若您是商家可以在本站进行投稿,查看详情!此外我们还提供软文收录、PayPal代付、广告赞助等服务,查看详情! |
我们发布的部分优惠活动文章可能存在时效性,购买时建议在本站搜索商家名称可查看相关文章充分了解该商家!若非中文页面可使用Edge浏览器同步翻译!PayPal代付/收录合作 |
本文带你聊聊小程序中的Log日志系统,介绍如何使用小程序的Log日志系统,以及如何搭建小程序的日志系统,希望对你有所帮助!
通常,日志系统是开发的一个重要部分。
但是由于种种原因,在前端开发中做日志打印和报表系统的并不常见。但是,在某些特定的情况下,日志系统往往能创造奇迹。
例如,一个聊天系统遇到了以下问题:
在语音通话过程中,用户听不到声音。在即时通讯中,有些场景是用户反馈的,消息发不出去。在即时消息中,当A回复B的消息时,对话框偶尔不会显示。A连续给B发了两条消息后,B收不到第二条消息的提示。在即时通讯中,当发送语音消息时,用户认为语音已经发送,但实际上录音仍在进行。这个时候用户以为是网卡,最后发现自己和别人说话的声音被录了下来。但是,上述错误并没有在后台界面中反映出来。再加上部分用户手机型号的问题,很难定位问题。如果我们在这里有一个日志,我们可以很快找到出错的代码。如果不是代码问题,更有底气回复用户不是我们系统的问题。
如何使用小程序日志日志系统小程序端提供了两个小程序日志接口:
LogManager(通用日志)RealtimeLogManager(实时日志)官方并没有介绍两者的具体区别,只是强调了Realtime的实时性。
在我看来,他们之间最大的区别是:
LogManager能让用户安心,因为LogManager是用户手工反馈的问题。RealtimeLogManager对开发者更友好,可以在用户不知情的情况下收集问题信息,在用户没有感觉的情况下修复问题。日志管理器
小程序提供的Log log接口,通过wx.getLogManager()获取实例。注意:
最多保存5M的日志内容,超过5M后,旧的日志内容将被删除。对于小程序,用户可以使用open -type = ;按钮组件反馈 上传打印的日志。对于小游戏,用户可以使用wx.createFeedbackButton创建一个上传打印日志的按钮,开发者可以通过小程序管理后台左侧菜单的反馈管理页面查看相关的打印日志。创建日志管理器实例
可以通过wx.getLogManager()获取日志实例。可以通过括号中的{level: 0 | 1}来决定是否写Page的生命周期函数,wx命名空间中的函数log。
0:写入1:不要写入https://github.com/Kujiale-Mobile/Painter.使用的日志管理器实例
const logger = wx . getlog manager({ level:0 })logger . log({ str: # 39;你好世界 # 39;}, '基本日志 # 39;,100,[1,2,3])logger . info({ str: # 39;你好世界 # 39;}, '信息日志 # 39;,100,[1,2,3])logger . debug({ str: # 39;你好世界 # 39;}, '调试日志 # 39;,100,[1,2,3])logger . warn({ str: # 39;你好世界 # 39;}, '警告日志 # 39;,100,[1,2,3])用户反馈上传LogManager记录的日志。
登录后,用户可以在小程序的个人资料页面点击反馈和投诉,点击异常功能上传日志。
处理用户反馈,与用户沟通。
开发者可以在小程序后台管理->:用户反馈->:功能异常查看用户反馈的信息。开发者可以在功能->:客服绑定客服微信中访问。绑定后,可以在48小时内通过微信与反馈用户沟通。
RealtimeLogManager
小程序提供的实时日志Log接口,通过wx.getRealtimeLogManager()获取实例。注意:
Wx.getRealtimeLogManager()基本库2.7.1开始支持官方实时日志,每个日志最大容量为5kb。每个日志的官方定义是:on show -on one page >: OnHide,汇聚合成一个日志,上报给开发者。开发者可以从小程序管理后台:开发->:运维中心->:实时日志进入小程序端日志查询页面,创建一个RealtimeLogManager的实例。
可以通过wx.getRealtimeLogManager()获取实时日志实例。
const logger = wx . getrealtimelogmanager()使用RealtimeLogManager实例。
const logger = wx . getrealtimelogmanager()logger . debug({ str: # 39;你好世界 # 39;}, '调试日志 # 39;,100,[1,2,3])logger . info({ str: # 39;你好世界 # 39;}, '信息日志 # 39;,100,[1,2,3])logger . error({ str: # 39;你好世界 # 39;}, '错误日志 # 39;,100,[1,2,3])logger . warn({ str: # 39;你好世界 # 39;}, '警告日志 # 39;,100,[1,2,3])查看实时日志。
与普通日志不同,实时日志不再需要用户反馈,可以通过以下方式直接查看实例。
登录小程序背景
路径开发->:管理->:运维中心->:实时日志查看实时日志
如何构建一个小程序日志系统
上面小程序的Log log我们知道怎么用,当然可以不用封装直接用。但是我们直接用起来很别扭,因为不符合我们程序员单点调用的习惯。
然后,我们对这个日志系统和全局方法的日志注入做一个初步的封装。
封装小程序日志方法
在封装日志方法之前,我们需要理清该方法需要考虑的内容:
打印格式:统一的打印格式有助于我们更快地定位问题版本号。方便我们清楚的知道当前用户使用的小程序版本,避免老版本的问题。在新代码中找不到任何问题。兼容性:我们需要考虑用户的applet版本不足以支持getLogManager和getRealtimeLogManager的情况类型。我们需要与调试、日志和错误类型的日志版本兼容。
我们需要一个常量来定义版本号,这样我们就可以定位有问题的代码版本。如果出现版本问题,我们可以更好地引导用户。
常量版本= 1 . 0 . 0 ;const logger = wx . getlog manager({ level:0 })logger . log(version,info)打印格式
我们可以通过【版本】文件|内容的统一格式更快的定位内容。
常量版本= 1 . 0 . 0 ;const logger = wx . getlog manager({ level:0 })logger . log(`[$ { version }]$ { file } | `,...args)兼容性
我们需要考虑用户小程序版本不足以支持getLogManager和getRealtimeLogManager的情况。
常量版本= 0 . 0 . 18 ;;const canuselogmanage = wx . cani use( ;getLogManager );const logger = canIUseLogManage?wx . getlog manager({ level:0 }):null;const realtimeLogger = wx . getrealtimelogmanager?wx . getrealtimelogmanager():null;导出功能运行(文件、...args){ console . log(`[$ { VERSION }]`,file, | ,...args);if(canuselogmanage){ logger . log(`[$ { VERSION }]`,file, | ,...args);}实时记录器 real time logger . info(`[$ { VERSION }]`,file, | ,...args);}类型
我们需要与调试、日志和错误类型兼容的日志。
导出功能运行(文件、...args) {...}导出函数调试(文件、...args) {...}导出函数错误(文件、...args) {...}导出函数getLogger(文件名){ return { DEBUG: function(...args) { DEBUG(文件名,...args) },Run: function(...args) {run(文件名,...args)},错误:函数(...args) {error(文件名,...args)}}完整代码
以上都做好了,一个日志系统的基本包就完成了。
常量版本= 0 . 0 . 18 ;;const canuselogmanage = wx . cani use( ;getLogManager );const logger = canIUseLogManage?wx . getlog manager({ level:0 }):null;const realtimeLogger = wx . getrealtimelogmanager?wx . getrealtimelogmanager():null;导出函数调试(文件、...args){ console . debug(`[$ { VERSION }]$ { file } | `,...args);if(canuselogmanage){ logger . debug(`[$ { VERSION }]`,file, | ,...args);}实时记录器 real time logger . info(`[$ { VERSION }]`,file, | ,...args);}导出函数运行(文件、...args){ console . log(`[$ { VERSION }]`,file, | ,...args);if(canuselogmanage){ logger . log(`[$ { VERSION }]`,file, | ,...args);}实时记录器 real time logger . info(`[$ { VERSION }]`,file, | ,...args);}导出函数错误(文件、...args){ console . error(`[$ { VERSION }]`,file, | ,...args);if(canuselogmanage){ logger . error(`[$ { VERSION }]`,file, | ,...args);}实时记录器 real time logger . error(`[$ { VERSION }]`,file, | ,...args);}导出函数getLogger(文件名){ return { DEBUG: function(...args) { DEBUG(文件名,...args) },Run: function(...args) {run(文件名,...args)},错误:函数(...args) {error(文件名,...args)}}全局注入日志
通过这一章的名称,我们可以知道全球注射。全局注入是指在方法编写完成后自动注入日志,不需要手动调用,你只需要考虑打印更详细的日志。
为什么全球注射?
虽然我们实现了全局日志的封装,但是很多情况下,有些新生没有打日志的好习惯,尤其是前端的同学(我也是)。所以我们需要做一个全局注入,方便我们的代码编写,避免手动登录时的遗漏问题。
如何进行全局注射?
applet提供了行为参数,允许多个页面拥有相同的数据字段和方法。
我们可以封装一个通用的行为,然后在需要日志的页面上介绍它。
将*作为日志从 。/log-test ;;导出默认行为({ definition filter(def fields){ console . log(def fields);object . keys(def fields . methods | | { })。forEach(method name = gt;{ const origin method = def fields . methods[method name];deffields . methods[method name]= function(ev,...args){ if(ev ; ev.target ev.currentTarget ev.currentTarget.dataset) { Log。RUN(defFields.data.PAGE_NAME,` ${ method NAME } invoke,event dataset = `,ev.currentTarget.dataset, params = ,...args);} else { Log。RUN(defFields.data.PAGE_NAME,` ${ method NAME } invoke,params = `,ev,...args);} originmethod.call (this,ev...args)}}})摘要
随着发展和巩固,在许多领域也有200主机参考字符。用了三天,总体感觉还是值得的。希望能给你一些帮助。
也希望大家多多关注前端日志。这是基于我自己的感受,尤其是移动用户。很多时候问题都是手机型号和网络环境弱造成的。没有日志的时候,找不到问题的焦点,很难及时解决问题。
【相关学习推荐:小程序开发教程】以上就是说说小程序中的Log日志系统,看看如何搭建和使用的细节。更多请关注主机参考其他相关文章!
这几篇文章你可能也喜欢:
本文由主机参考刊发,转载请注明:谈谈小程序中的Log log系统,看看如何构建和使用。 https://zhujicankao.com/74555.html
评论前必须登录!
注册