当前位置: 首页 > news >正文

图解 微信开发者工具 小程序源码 调试、断点标记方法 , 微信小程序调试器,真机调试断点调试方法,小程序网络API请求调试方法 总结

在我们使用微信开发者工具进行微信小程序开发的时候,在这个微信开发者工具的代码编辑框里面我们是无法像使用vscode, idea等IDE工具时那样直接对代码打断点进行调试,   原因是小程序实际上他就是一个web浏览器应用的包装, 在其内部使用的还是类似chrome的内核。所以微信小程序的打断点调试也和chrome应用的调试是一样的,只不过调试代码的位置不一样而已。 

微信开发者工具 调试器

如有如下微信小程序的界面,我们需要对源码中的 pages/login/login.js 文件中的业务进行断点调试。

首先我们在打开代码后需要点击 左上角的 调试器  然后就会出现右下角这部分调试器窗口, 这里的窗口是不是和 chrome的开发者工具 很像啊? 其实他就是chrome开发者工具的定制改造版。

微信小程序 调试源码位于 调试器-->Sources -> Page -->appContext --> weapp:// 这个节点下 文件后缀有 [sm] 的js文件都可以打断点进行调试,如下图

怎么样是不是很简单? 赶快动手试试吧!

微信小程序真机调试 断点标记方法

微信小程序的开发中,我们使用真机调试的时候也可以对代码打断点,打断点的位置位于  Sources -> Page -> usr 节点下, 如下图示例:

在上面的文件中打上断点,然后在真机里面进行操作,当代码运行到指定的断点处时就会被捕获。

网络API请求接口调试方法

对于小程序里面的网络API请求调试,我们可以在调试器-->Network-->XHR --> 选择请求接口 --> Initiator 里面通过查看网络请求链路的调用情况,快速定位到网络请求的发出源码位置,注意这里的请求链路可能会很长, 我们可以忽略最顶上的几个文件和以 WASxxx开头的这些文件的链路,中间部分应该就是当前的API文件请求的源码,点击文件名即可进入断点调试源码,然后就可以对源码设置断点进行调试,   如下图:

如上面的  doLogin 对应的 login.js文件,我们点击后就可以进入 断点源码文件, 选择文件名右键 点击  Reveal in sidebar 即可在当前的Page里面定位文件的位置,如下图:

这里的网络API请求的调试方法和Chrome 开发者工具中的网络 启动器 是一样的,如下图

总结: 微信小程序的源码调试 在调试器里面的断点文件位于调试器-->Source -> Page -->appContext --> weapp:// 这个节点下 文件后缀为 [sm]的js文件, 而真机调试的断点文件位于 真机调试窗口 Source -> Page -> usr 节点之下。 他们的调试方式与chrome的开发者工具里面的调试方式是一样的,只不过位置节点不一样而言, 对于其他的各种小程序的调试方法也都是大致一样的。

 

相关文章:

图解 微信开发者工具 小程序源码 调试、断点标记方法 , 微信小程序调试器,真机调试断点调试方法,小程序网络API请求调试方法 总结

在我们使用微信开发者工具进行微信小程序开发的时候,在这个微信开发者工具的代码编辑框里面我们是无法像使用vscode, idea等IDE工具时那样直接对代码打断点进行调试, 原因是小程序实际上他就是一个web浏览器应用的包装, 在其内部使用的还是类似chrome的…...

注释,换行,控制台输入输出,命名空间,省略return语句

注释 1.单行注释 // 2.多行注释 /*注释内容*/ 解释代码的作用&#xff1b;注释多余内容&#xff1b;注释不会影响代码执行 换行 \nstd::endl 控制台输入输出 输出123456 可一次性输出多个 std::cout<<"123456"//示例获取控制台输入内容&#xff0c;存储在…...

宠物空气净化器该怎么选?希喂,小米、安德迈这三款好用吗?

不得不说&#xff0c;虽然现在购物网站的活动不少&#xff0c;可力度都好弱啊&#xff01;我想买宠物空气净化器很久了&#xff0c;觉得有点贵&#xff0c;一直没舍得入手。价格一直没变化&#xff0c;平台小活动根本没什么优惠&#xff0c;只能寄希望于双十一了&#xff0c;准…...

【Mybatis篇】Mybatis的注解开发

&#x1f9f8;安清h&#xff1a;个人主页 &#x1f3a5;个人专栏&#xff1a;【计算机网络】&#xff0c;【Mybatis篇】 &#x1f6a6;作者简介&#xff1a;一个有趣爱睡觉的intp&#xff0c;期待和更多人分享自己所学知识的真诚大学生。 文章目录 &#x1f3af; Select注解 …...

NEC协议

NEC协议是一种红外线通信协议&#xff0c;广泛应用于家电遥控器和其他红外线设备之间的通信。以下是对NEC协议的详细解释和介绍&#xff1a; 一、开发背景与应用 NEC协议由日本电子公司NEC&#xff08;日本电气公司&#xff09;开发&#xff0c;因其简单、易于实现和广泛兼容…...

Meta 发布 Quest 3S 头显及 AR 眼镜原型:开启未来交互新视界

简介 在科技的浪潮中&#xff0c;Meta 始终站在创新的前沿&#xff0c;不断为我们带来令人惊叹的虚拟现实和增强现实体验。2024 年 10 月 6 日&#xff0c;让我们一同聚焦 Meta 最新发布的 Quest 3S 头显及 AR 眼镜原型&#xff08;Orion&#xff09;&#xff0c;探索这两款产品…...

【CSS】水平垂直居中

给父盒子设置属性 flex display: flex;写在父元素上这就是定义了一个伸缩容器justify-content&#xff1a;center 设置主轴对齐方式为居中&#xff0c;默认是横轴。子元素居中。align-items&#xff1a;center 设置纵轴对齐方式为居中&#xff0c;默认是纵轴。子元素居中。 给…...

欧盟零毁林法案 EUDR

EUDR法案&#xff0c;即欧盟零毁林法案&#xff08;EU Deforestation Regulation&#xff09;&#xff0c;是欧盟为了减少全球森林砍伐和退化&#xff0c;应对气候变化和生物多样性丧失而制定的一项重要法规。以下是对该法案的详细解读&#xff1a; 一、法案背景与目的 EUDR法…...

26.删除有序数组中的重复项

题目::26. 删除有序数组中的重复项 - 力扣&#xff08;LeetCode&#xff09; 思路:只要不和前面的数一样就可以移动指针&#xff0c;进行赋值 代码: class Solution { public:int removeDuplicates(vector<int>& nums) {int slow 0 ;for(int fast 1; fast < …...

JAVA实现公众号扫码登录和关注功能实战

前言 使用第三方插件 <dependency><groupId>com.github.binarywang</groupId><artifactId>weixin-java-mp</artifactId><version>4.6.0</version> </dependency>准备APPID和appSecet 登录微信公众号后台&#xff0c;复制ap…...

初识Mysql/备份,基础指令

1&#xff0c;MySQL登录指令&#xff1a; mysql -h 127.0.0.1 -P3306 -u -p 其中&#xff0c;-h指明登录部署了mysql服务的主机 -P指明要访问的端口号&#xff0c; -u指明登录用户 -p输入密码 2&#xff0c;数据库基础 mysql&#xff1a;表示的是客户端 mysqld&…...

没想到吧!线稿上色居然可以这么简单

前言 在创意无限的数字艺术世界里&#xff0c;艺术创作中的线稿上色&#xff0c;向来是件既费时又需技巧的活儿&#xff0c;寻找一款既能激发灵感又能简化繁琐流程的工具&#xff0c;是每位艺术家心中的向往。 今天&#xff0c;为大家推荐一款革命性的线稿上色AI工具——千鹿…...

修改Docker的默认存储路径

docker默认存储路径&#xff1a;/var/lib/docker/ 执行 docker info 查看&#xff0c;得到以下信息 Docker Root Dir: /var/lib/docker/Debug Mode: falseRegistry: https://index.docker.io/v1/Labels:Experimental: falseInsecure Registries: 1.修改docker配置 要修改默认…...

深入计算机语言之C++:C到C++的过度

&#x1f511;&#x1f511;博客主页&#xff1a;阿客不是客 &#x1f353;&#x1f353;系列专栏&#xff1a;从C语言到C语言的渐深学习 欢迎来到泊舟小课堂 &#x1f618;博客制作不易欢迎各位&#x1f44d;点赞⭐收藏➕关注 一、什么是C C&#xff08;c plus plus&#xff…...

HR面试篇

一.面试中被问职业规划 HR感兴趣的不是你的职业规划,感兴趣的是你的职业规划和他们公司有没有关系。 或者说他们公司能不能去帮助你去实现你的职业规划。 切忌不要讲不合实际的,比如要在公司赚多少钱等等。 要根据公司的特点,找到切入点,只要讲得积极向上就可以。 二.…...

深度探索Kali Linux的精髓与实践应用

Kali Linux简介 Kali Linux作为全球网络安全领域的首选操作系统之一&#xff0c;其强大的功能性及广泛的适用范围令人瞩目。除了上述基础介绍外&#xff0c;让我们深入探究Kali Linux的几个关键特性及其在实际操作中的具体应用案例。 Kali工具集成&#xff1a;全面的安全工具…...

【在Linux世界中追寻伟大的One Piece】DNS与ICMP

目录 1 -> DNS(Domain Name System) 1.1 -> DNS背景 2 -> 域名简介 2.1 -> 域名解析过程 3 -> 使用dig工具分析DNS 4 -> ICMP协议 4.1 -> ICMP功能 4.2 -> ICMP报文格式 4.3 -> Ping命令 4.4 -> traceroute命令 1 -> DNS(Domain Na…...

信息安全工程师(41)VPN概述

前言 VPN&#xff0c;即Virtual Private Network&#xff08;虚拟专用网络&#xff09;的缩写&#xff0c;是一种通过公共网络&#xff08;如互联网&#xff09;创建私密连接的技术。 一、定义与工作原理 定义&#xff1a;VPN是依靠ISP&#xff08;Internet Service Provider&…...

算法:双指针系列(一)

双指针系列 一、移动零&#xff08;一&#xff09;题目分析&#xff08;二&#xff09;代码展示二、复写零&#xff08;一&#xff09;题目分析&#xff08;二&#xff09;代码展示三、快乐数&#xff08;一&#xff09;题目分析&#xff08;二&#xff09;代码展示&#xff08…...

跟《经济学人》学英文:2024年09月28日这期 The curse of the Michelin star

The curse of the Michelin star Restaurants awarded the honour are more likely to close, research finds 原文&#xff1a; The twelve new restaurants added to the New York Michelin Guide this month, serving up cuisine ranging from “haute French” to “eco…...

超短脉冲激光自聚焦效应

前言与目录 强激光引起自聚焦效应机理 超短脉冲激光在脆性材料内部加工时引起的自聚焦效应&#xff0c;这是一种非线性光学现象&#xff0c;主要涉及光学克尔效应和材料的非线性光学特性。 自聚焦效应可以产生局部的强光场&#xff0c;对材料产生非线性响应&#xff0c;可能…...

在鸿蒙HarmonyOS 5中实现抖音风格的点赞功能

下面我将详细介绍如何使用HarmonyOS SDK在HarmonyOS 5中实现类似抖音的点赞功能&#xff0c;包括动画效果、数据同步和交互优化。 1. 基础点赞功能实现 1.1 创建数据模型 // VideoModel.ets export class VideoModel {id: string "";title: string ""…...

深入浅出:JavaScript 中的 `window.crypto.getRandomValues()` 方法

深入浅出&#xff1a;JavaScript 中的 window.crypto.getRandomValues() 方法 在现代 Web 开发中&#xff0c;随机数的生成看似简单&#xff0c;却隐藏着许多玄机。无论是生成密码、加密密钥&#xff0c;还是创建安全令牌&#xff0c;随机数的质量直接关系到系统的安全性。Jav…...

UDP(Echoserver)

网络命令 Ping 命令 检测网络是否连通 使用方法: ping -c 次数 网址ping -c 3 www.baidu.comnetstat 命令 netstat 是一个用来查看网络状态的重要工具. 语法&#xff1a;netstat [选项] 功能&#xff1a;查看网络状态 常用选项&#xff1a; n 拒绝显示别名&#…...

智能仓储的未来:自动化、AI与数据分析如何重塑物流中心

当仓库学会“思考”&#xff0c;物流的终极形态正在诞生 想象这样的场景&#xff1a; 凌晨3点&#xff0c;某物流中心灯火通明却空无一人。AGV机器人集群根据实时订单动态规划路径&#xff1b;AI视觉系统在0.1秒内扫描包裹信息&#xff1b;数字孪生平台正模拟次日峰值流量压力…...

什么是Ansible Jinja2

理解 Ansible Jinja2 模板 Ansible 是一款功能强大的开源自动化工具&#xff0c;可让您无缝地管理和配置系统。Ansible 的一大亮点是它使用 Jinja2 模板&#xff0c;允许您根据变量数据动态生成文件、配置设置和脚本。本文将向您介绍 Ansible 中的 Jinja2 模板&#xff0c;并通…...

鸿蒙DevEco Studio HarmonyOS 5跑酷小游戏实现指南

1. 项目概述 本跑酷小游戏基于鸿蒙HarmonyOS 5开发&#xff0c;使用DevEco Studio作为开发工具&#xff0c;采用Java语言实现&#xff0c;包含角色控制、障碍物生成和分数计算系统。 2. 项目结构 /src/main/java/com/example/runner/├── MainAbilitySlice.java // 主界…...

LangChain知识库管理后端接口:数据库操作详解—— 构建本地知识库系统的基础《二》

这段 Python 代码是一个完整的 知识库数据库操作模块&#xff0c;用于对本地知识库系统中的知识库进行增删改查&#xff08;CRUD&#xff09;操作。它基于 SQLAlchemy ORM 框架 和一个自定义的装饰器 with_session 实现数据库会话管理。 &#x1f4d8; 一、整体功能概述 该模块…...

[USACO23FEB] Bakery S

题目描述 Bessie 开了一家面包店! 在她的面包店里&#xff0c;Bessie 有一个烤箱&#xff0c;可以在 t C t_C tC​ 的时间内生产一块饼干或在 t M t_M tM​ 单位时间内生产一块松糕。 ( 1 ≤ t C , t M ≤ 10 9 ) (1 \le t_C,t_M \le 10^9) (1≤tC​,tM​≤109)。由于空间…...

CppCon 2015 学习:Time Programming Fundamentals

Civil Time 公历时间 特点&#xff1a; 共 6 个字段&#xff1a; Year&#xff08;年&#xff09;Month&#xff08;月&#xff09;Day&#xff08;日&#xff09;Hour&#xff08;小时&#xff09;Minute&#xff08;分钟&#xff09;Second&#xff08;秒&#xff09; 表示…...