【微信】实战Adnroid上的小程序调试

2024-03-06 19:28

本文主要是介绍【微信】实战Adnroid上的小程序调试,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

▒ 目录 ▒

    • 🛫 导读
      • 需求
      • 开发环境
    • 1️⃣ XWeb 内核
      • 准备工作
      • 连接手机设备到电脑上
      • 查看效果
    • 2️⃣ X5 内核(遗弃了?)
      • vConsole
      • 操作步骤
    • 🛬 文章小结
    • 📖 参考资料

🛫 导读

需求

如今小程序得到了越来越广泛的应用,针对小程序的分析需求也越来越多。小程序作为前端开发的一个产品形态,必然绕不过Chrome浏览器相关技巧,如果能打开其调试界面,也就离成功不远了。

开发环境

版本号描述
文章日期2024-03-06
手机红米K50
操作系统Android 13
User-AgentMozilla/5.0 (Linux; Android 13; 22041211AC Build/TP1A.220624.014; wv) AppleWebKit/537.36 (KHTML, like Gecko) Version/4.0 Chrome/116.0.0.0 Mobile Safari/537.36 XWEB/1160065 MMWEBSDK/20230405 MMWEBID/3573 MicroMessenger/8.0.35.2360(0x28002339) WeChat/arm64 Weixin NetType/WIFI Language/zh_CN ABI/arm64

1️⃣ XWeb 内核

微信在某一次更新中取消了 X5 内核,采用了 XWeb 内核。由此导致之前使用 vConsole 执行 JavaScript 代码的方法失效了。为了解决这个问题,我们需要采用最新的 XWeb 内核调试方法来执行 JavaScript 代码。

准备工作

手机端

  • 在微信中打开链接 http://debugxweb.qq.com/?inspector=true。
    或者直接扫二维码:
    在这里插入图片描述
  • 打开这个链接后如果跳转到微信官网,就算成功了。

电脑端

  • 在电脑上的 Microsoft Edge 浏览器地址栏中输入 edge://inspect/#devices 并打开。
    • 如果使用的是 Chrome 浏览器,地址栏中输入 chrome://inspect/#devices 并打开。
  • 确保以下两个选项处于选中状态。
    在这里插入图片描述

连接手机设备到电脑上

  • 确保手机处于非锁屏状态,并通过数据线与电脑连接。
  • 手机开启开发者模式,然后开启USB调试(不同的设备开启USB调试的方法可能不同,还请自行搜索)
  • 如果是首次连接,手机会弹出一个是否信任调试设备的提示,请选择 “信任”。
  • 这时,设备将会显示在远程目标(Remote Target)中(有数秒钟的延时)。
    在这里插入图片描述

查看效果

在远程目标(Remote Target)下方会出现设备型号,在手机微信内打开你想要快进的网页。
选择上面打开的网页,点击其左下角的 “inspect”,打开调试窗口。
在这里插入图片描述

2️⃣ X5 内核(遗弃了?)

随着微信版本不断的迭代更新,微信要求必须使用新版本才能登录,导致小编只能借其它博客的图片介绍了。
前几年小编也的确用过,总体感觉不太好用,新内核XWeb的确更方便。

vConsole

一个轻量、可拓展、针对手机网页的前端开发者调试面板。
vConsole 是框架无关的,可以在 Vue、React 或其他任何框架中使用。
现在 vConsole 是微信小程序的官方调试工具。
小程序和小游戏的 vConsole 展示内容会有一定差别,小程序 vConsole示例:
在这里插入图片描述
小游戏 vConsole示例:
在这里插入图片描述

操作步骤

手机端

  • 在微信中打开链接 http://debugx5.qq.com/。
    或者直接扫二维码:
    在这里插入图片描述
  • 进去后,选择中间‘’信息‘’,然后一直往下翻,把vConsole打开,把下面两个Content Cache关掉。
    在这里插入图片描述
  • 然后打开你要调试的页面,你就你能看到右下角有个绿色按钮vConsole。点击就能查看你代码中console的内容了。

🛬 文章小结

这篇文章介绍了如何使用微信的XWeb内核和X5内核调试功能。
通过调试窗口,可以方便研发排错或者逆向调试等。

📖 参考资料

  • 使用微信的 XWeb 内核调试功能 https://blog.littlebell.top/posts/1704763378/
  • vConsole https://developers.weixin.qq.com/miniprogram/dev/framework/usability/vConsole.html
  • 微信客户端开启vconsole调试 https://blog.csdn.net/zwrlj527/article/details/117789582

ps: 文章中内容仅用于技术交流,请勿用于违规违法行为。

这篇关于【微信】实战Adnroid上的小程序调试的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!


原文地址:
本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.chinasem.cn/article/781077

相关文章

从入门到进阶讲解Python自动化Playwright实战指南

《从入门到进阶讲解Python自动化Playwright实战指南》Playwright是针对Python语言的纯自动化工具,它可以通过单个API自动执行Chromium,Firefox和WebKit... 目录Playwright 简介核心优势安装步骤观点与案例结合Playwright 核心功能从零开始学习

Java docx4j高效处理Word文档的实战指南

《Javadocx4j高效处理Word文档的实战指南》对于需要在Java应用程序中生成、修改或处理Word文档的开发者来说,docx4j是一个强大而专业的选择,下面我们就来看看docx4j的具体使用... 目录引言一、环境准备与基础配置1.1 Maven依赖配置1.2 初始化测试类二、增强版文档操作示例2.

Spring Boot 结合 WxJava 实现文章上传微信公众号草稿箱与群发

《SpringBoot结合WxJava实现文章上传微信公众号草稿箱与群发》本文将详细介绍如何使用SpringBoot框架结合WxJava开发工具包,实现文章上传到微信公众号草稿箱以及群发功能,... 目录一、项目环境准备1.1 开发环境1.2 微信公众号准备二、Spring Boot 项目搭建2.1 创建

MySQL 多列 IN 查询之语法、性能与实战技巧(最新整理)

《MySQL多列IN查询之语法、性能与实战技巧(最新整理)》本文详解MySQL多列IN查询,对比传统OR写法,强调其简洁高效,适合批量匹配复合键,通过联合索引、分批次优化提升性能,兼容多种数据库... 目录一、基础语法:多列 IN 的两种写法1. 直接值列表2. 子查询二、对比传统 OR 的写法三、性能分析

Python办公自动化实战之打造智能邮件发送工具

《Python办公自动化实战之打造智能邮件发送工具》在数字化办公场景中,邮件自动化是提升工作效率的关键技能,本文将演示如何使用Python的smtplib和email库构建一个支持图文混排,多附件,多... 目录前言一、基础配置:搭建邮件发送框架1.1 邮箱服务准备1.2 核心库导入1.3 基础发送函数二、

PowerShell中15个提升运维效率关键命令实战指南

《PowerShell中15个提升运维效率关键命令实战指南》作为网络安全专业人员的必备技能,PowerShell在系统管理、日志分析、威胁检测和自动化响应方面展现出强大能力,下面我们就来看看15个提升... 目录一、PowerShell在网络安全中的战略价值二、网络安全关键场景命令实战1. 系统安全基线核查

从原理到实战深入理解Java 断言assert

《从原理到实战深入理解Java断言assert》本文深入解析Java断言机制,涵盖语法、工作原理、启用方式及与异常的区别,推荐用于开发阶段的条件检查与状态验证,并强调生产环境应使用参数验证工具类替代... 目录深入理解 Java 断言(assert):从原理到实战引言:为什么需要断言?一、断言基础1.1 语

Java MQTT实战应用

《JavaMQTT实战应用》本文详解MQTT协议,涵盖其发布/订阅机制、低功耗高效特性、三种服务质量等级(QoS0/1/2),以及客户端、代理、主题的核心概念,最后提供Linux部署教程、Sprin... 目录一、MQTT协议二、MQTT优点三、三种服务质量等级四、客户端、代理、主题1. 客户端(Clien

在Spring Boot中集成RabbitMQ的实战记录

《在SpringBoot中集成RabbitMQ的实战记录》本文介绍SpringBoot集成RabbitMQ的步骤,涵盖配置连接、消息发送与接收,并对比两种定义Exchange与队列的方式:手动声明(... 目录前言准备工作1. 安装 RabbitMQ2. 消息发送者(Producer)配置1. 创建 Spr

java向微信服务号发送消息的完整步骤实例

《java向微信服务号发送消息的完整步骤实例》:本文主要介绍java向微信服务号发送消息的相关资料,包括申请测试号获取appID/appsecret、关注公众号获取openID、配置消息模板及代码... 目录步骤1. 申请测试系统2. 公众号账号信息3. 关注测试号二维码4. 消息模板接口5. Java测试