小程序导航 https://wq.xmaht.top

开发者在开发小程序的时候可能会碰到一些这样的问题:

问题1  开发者工具上看效果没问题,但是在真机上测试不行?

问题2  有用户遇到小程序功能无法使用的问题,但无法快速定位解决?

今天与大家分享一些真机定位的技巧,可以解决上面两个问题。

1、vConsole开发利器和远程调试功能

针对问题1,我们提供了 vConsole 开发利器和远程调试功能,可以协助开发者在定位真机上的问题。

vConsole 的有四个Tab面板,可以先看下 Log 面板,看是否有异常信息,异常类型 thirdScriptError 是框架捕捉到的开发者的代码执行的异常,可以优先处理异常信息看是否可以解决问题。Log 面板可以看到异常出现的文件和行数。

除了异常日志,开发者还可以通过 console.log接口在一些关键执行路径上打日志来定位问题,这些日志会呈现在 Log 面板上。

vConsole 默认是不开启的,可以通过下面2个方法来开启:

开发版和体验版可以点击小程序页面右上角的...按钮打开的菜单项“打开调试”来开启 vConsole。

正式版没有“打开调试”的菜单项,可以先通过开发版和体验版来开启 vConsole,然后再打开正式版。或者可以预埋一个隐藏操作,比如连续点击某个 Button 多次,然后调用 API 接口 wx.setEnableDebug来打开。

vConsole 虽然强大,但在手机上查看大量的日志信息不方便,此外,vConsole 没有断点调试、无法修改样式,定位复杂问题需要花费比较多的时间。

小程序的业务逻辑运行在 AppService 层,页面渲染在 WebView 运行,并通过微信客户端通信,因此,我们想到了可以让 AppService 运行在开发者工具,页面渲染还是在手机 WebView,两者通过网络来通信,这样借助开发者工具的调试能力,就可以实现远程调试功能

远程调试窗口通过手机客户端扫描开发者工具上生成的二维码来打开,无需像普通手机 H5 页面调试一样,需要在手机端进行一些设置。

打开的远程调试界面和开发者工具的模拟器的调试界面很像,需要注意的是,要在 Console 里对小程序进行调试,需要将调试的上下文切换到 VM Context 1 。

更多的远程调试的使用方法请参考使用文档

2、意见反馈能力

对于问题2,小程序的使用反馈来自用户投诉,这种情况用户无法联系到开发者。我们遇见过有小程序功能出现问题,用户无法使用,但投诉无门的情况,而这些问题,开发者也没有途径去收集以及处理,这就导致了小程序服务质量下降,用户流失。

为此,我们开发了“意见反馈”功能,当出现问题时,开发者可以引导用户使用“意见反馈”进行反馈,并上传日志来辅助开发者定位问题。操作过程如下:

引导用户进入小程序帐号详情页面,具体可以在小程序界面点击右上角...按钮,选择关于菜单。接着在帐号详情页面点击右上角...按钮,选择意见反馈菜单进入页面。页面可以上传图片和日志,建议用户上传异常情况的截图,以及勾选允许开发者使用小程序日志选项上传日志,反馈信息越详细,越有助于定位问题。


如果觉得上面的操作步骤太麻烦,开发者可以通过在页面 WXML 添加下面的按钮,用户点击按钮可以直接打开“意见反馈”页面。

开发者需要定时处理用户的反馈,这样才能保证小程序的质量。开发者可以登录小程序管理后台,进入左侧菜单客服反馈,就可以看到用户的反馈内容以及下载日志来辅助定位问题。

为了保证日志信息足够详细,开发者需要用下面的接口在代码的关键执行路径上写日志。

wx.getLogManager 接口的更详细使用请参考文档

希望通过这些小技巧,可以帮助大家顺畅地开发小程序。

微信小程序真机定位问题技巧的更多相关文章

  1. 原创:跳坑指南——微信小程序真机预览跟本地不同的问题

    微信小程序中出现最多的一个问题,就是真机跟本地不同:我简单列举一些我发现的原因,给大家参考,大家也可以把自己发现的东西回复给我,给我参考:本地看不到数据,就先让本地能看到数据,再看本帖.... 1:本 ...

  2. 微信小程序真机预览跟本地不同的问题。原文地址:https://blog.csdn.net/qq_27187991/article/details/69664247/

    微信小程序中出现最多的一个问题,就是真机跟本地不同:我简单列举一些我发现的原因,给大家参考,大家也可以把自己发现的东西回复给我,给我参考: 本地看不到数据,就先让本地能看到数据,再看本帖....特别提 ...

  3. 小程序真机GET请求出现406错误

    问题:微信开发模拟器请求成功,获得数据,但是在真机上出现406请求错误,无法获得请求结果 原因:真机微信小程序的请求头与模拟器不同 怎么发现的:在请求头强制添加Accept即可解决 修复:在请求Hea ...

  4. 微信小程序导航:官方工具+精品教程+DEMO集合(1月7更新)

    1:官方工具:https://mp.weixin.qq.com/debug/w ... tml?t=14764346784612:简易教程:https://mp.weixin.qq.com/debug ...

  5. 原创:从零开始,微信小程序新手入门宝典《一》

    为了方便大家了解并入门微信小程序,我将一些可能会需要的知识,列在这里,让大家方便的从零开始学习:一:微信小程序的特点张小龙:张小龙全面阐述小程序,推荐通读此文: 小程序是一种不需要下载.安装即可使用的 ...

  6. 微信小程序踩坑集合

    1:官方工具:https://mp.weixin.qq.com/debug/w ... tml?t=1476434678461 2:简易教程:https://mp.weixin.qq.com/debu ...

  7. 微信小程序开发学习资料

    作者:初雪链接:https://www.zhihu.com/question/50907897/answer/128494332来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非商业转载请注明 ...

  8. 微信小程序学习指南

    作者:初雪链接:https://www.zhihu.com/question/50907897/answer/128494332来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非商业转载请注明 ...

  9. 从零开始:微信小程序新手入门宝典《一》

    为了方便大家了解并入门微信小程序,我将一些可能会需要的知识,列在这里,让大家方便的从零开始学习: 一:微信小程序的特点 张小龙:张小龙全面阐述小程序,推荐通读此文: 小程序是一种不需要下载.安装即可使 ...

随机推荐

  1. mysql+C#

    MySqlParameter[] prams = ]; prams[] = new MySqlParameter("@personindex", personindex); pra ...

  2. The sixteenth day

    It is a against the law to drive without a driver's license 翻译: 没有驾照,开车是违法的 注意点: 1.It(连读)is; witout( ...

  3. iDempiere 使用指南 采购入库流程

    Created by 蓝色布鲁斯,QQ32876341,blog http://www.cnblogs.com/zzyan/ iDempiere官方中文wiki主页 http://wiki.idemp ...

  4. 跨平台图表控件TeeChart使用教程:将图表数据导出为XML格式

    在开发者使用TeeChart进行开发的过程中,不管是在设计时或者运行时都可以使用的图表导出对话框将图表数据轻易地导出为XML格式: TeeChart最新版那下载地址 上图为TeeChart导出对话框的 ...

  5. Android监听安装卸载

    需要通过receiver来监听: 在AndroidManifest.xml文件中注册的receiver中必须加上<data android:scheme="package"/ ...

  6. 【起航计划 025】2015 起航计划 Android APIDemo的魔鬼步伐 24 App->Notification->Notifying Service Controller service中使用Notification

    这个例子介绍了如何在Service中使用Notification,相关的类为NotifyingController和NotifyingService. 在Service中使用Notification的 ...

  7. android ContentProvider共享数据

    ContentProvider共享数据 ContentProvider对外共享数据需要: 1.定义一个ContentProvider类,需要继承android的ContentProvider基类 2. ...

  8. Windows下安装ElasticSearch及工具

    转载自个人主页 前言 什么是ElasticSearch 官网如是介绍:Elasticsearch 是一个分布式.可扩展.实时的搜索与数据分析引擎. 它能从项目一开始就赋予你的数据以搜索.分析和探索的能 ...

  9. less通用pc移动库

    // less 文件 (移动端通用less文件) // 作者 marchen // 时间 2014/9/1 // 协议 MIT // 只考虑webkit内核手机浏览器和火狐内核浏览器 // 自定义le ...

  10. vue中css动画原理

    显示原理: <transition name='fade'> <div v-if='show'>hello world</div> </transition& ...