为了账号安全,请及时绑定邮箱和手机立即绑定

「小程序JAVA实战」 小程序远程调试(九)

在开发javaweb应用的时候,如果遇见一个问题都会调试,debug,在火狐和谷歌浏览器的时候我们也可以使用断点的方式调试js,小程序可以吗?肯定是可以的!小程序的调试也可以在手机端进行远程调试。源码:https://github.com/limingios/wxProgram.git 中的No.4

开始演示

  1. 登录微信小程序,获取appId,远程调试必须有AppID

  1. 新建项目
    记住这个必须填入AppID

  1. 了解功能按键
    >预览:手机可以通过扫描二维码的方式在手机上直接观看小程序
    >远程调试:可以在手机上进行操作,并且可以在电脑上弹出对应的控制台,来观察操作的效果,同时在手机和电脑上进行调试。

  1. 修改初始化代码
    >源码:https://github.com/limingios/wxProgram.git 中的No.4

  • app.js

//app.js
App({
  onLaunch: function (options) {
    console.log("onLaunch")
  },
  onShow: function (options) {
    console.log("onShow")
  },
  onHide: function () {
    console.log("onHide")
  },
  onError: function (msg) {
    console.log("onError")
  },
  globalData: 'I am global data'
})
  • app.json

{
  "pages":[
    "pages/index/index"
  ],
  "window":{
    "backgroundTextStyle":"light",
    "navigationBarBackgroundColor": "#fff",
    "navigationBarTitleText": "WeChat",
    "navigationBarTextStyle":"black"
  }
}
  • index.wxml

<!--index.wxml-->
<view class="container">
 {{motto}}
</view>
  • index.js

//index.js
//获取应用实例
const app = getApp()

Page({
  data: {
    motto: 'Hello World',
    userInfo: {},
    hasUserInfo: false,
    canIUse: wx.canIUse('button.open-type.getUserInfo')
  },

  onLoad: function () {
      this.setData({
        motto: app.globalData
      })
    }
})

  1. 打断点,源码中加入debugger

  • app.js

//app.js
App({
  onLaunch: function (options) {
    debugger
    console.log("onLaunch")
  },
  onShow: function (options) {
    debugger
    console.log("onShow")
  },
  onHide: function () {
    debugger
    console.log("onHide")
  },
  onError: function (msg) {
    debugger
    console.log("onError")
  },
  globalData: 'I am global data'
})

  1. 编辑工具下的调试
    > 开启调试器,可以通过f10单步进行调试

  1. 安装itools手机可以实时看到手机上的
    >扫描预览的效果

  1. 打开手机的调试

  • 重新进入小程序

点击vConsole

这里出发了onHide,上次在工具开发预览的时候并没有触发。.

  1. 开启远程调试
    >点击开启远程调试,也会生成一个二维码

  • 手机扫一扫,


  • 出现命中断点和远程调试窗口


  • 可以看到类似web调试的一些工具

  • 可以查看远端代码

PS:最后想到了什么老铁,可以查看远端的代码是不是就可以获取到借鉴他的代码了。其实微信早就想到了,不是所有的都可以的。远端调试必须知道他的APPID的,不是说直接看就可以了。

点击查看更多内容
TA 点赞

若觉得本文不错,就分享一下吧!

评论

作者其他优质文章

正在加载中
全栈工程师
手记
粉丝
1.7万
获赞与收藏
1318

关注作者,订阅最新文章

阅读免费教程

  • 推荐
  • 评论
  • 收藏
  • 共同学习,写下你的评论
感谢您的支持,我会继续努力的~
扫码打赏,你说多少就多少
赞赏金额会直接到老师账户
支付方式
打开微信扫一扫,即可进行扫码打赏哦
今天注册有机会得

100积分直接送

付费专栏免费学

大额优惠券免费领

立即参与 放弃机会
意见反馈 帮助中心 APP下载
官方微信

举报

0/150
提交
取消