使用微信开发者工具的调试器

在工作中，前端向后端发送请求，拿到数据。由于各种原因，会导致拿不到数据等，所以学会调试接口是必要的。

以下是使用微信开发者工具的调试器介绍

Wxml：可看到真实的页面结构和属性，通过左边的选择器，可快速找到页面中元素对应代码
Consle：显示小程序的错误输出，打印console.log的内容，可在此输入和调试代码
Storage：显示当前项目中使用setStorage或setStorageSync储存在本地的数据
Sources：小程序编译出错时可点击错误跳转到这里查错，打断点调试
Network：观察和显示接口的请求情况
- 选择XHR：可查看当前发送的请求
  - 点击请求：Headers可查看请求数据（最底下Request Payload显示请求接收到的参数）Preview和Response可查看响应数据
Appdata：显示项目当前页面 appdata 里的实时数据情况，可在此处编辑数据，并及时反馈到界面上

我平常调试接口的步骤：

查看状态码
检查请求路径、方式
请求头类型
查看是否传递参数，检查参数格式
查看后端返回的数据Preview

使用微信开发者工具的调试器相关推荐

如何使用【微信开发者工具】调试【企业微信】应用网页
今天新弄了个企业微信,在使用微信开发者工具调试的时候,遇到了如下的问题: 在网上找了下教程,发现全都是旧版本的解决方法不适用.这里介绍下新的企业微信的解决方案: 1.首先,你必须是这个企业微信的管理员 ...
升级开发者工具后调试器Storage和AppData目录找不见解决方法
1.调试-打开调试目录-插件目录 2.将inspector文件夹删除,在重启一下微信开发者工具就好了
企业微信H5在微信开发者工具中调试：
1. 给开发者添加企业微信管理员 2. 开发者--网页登录企业微信官网,找到"我的企业"下"微信插件",勾选"开发者工具". 3. 顺利进行 ...
微信开发者工具IDE调试webview内嵌H5方式
webview页面,为小程序比较常见的场景,但是当我们调试H5页面,查看接口相关报文信息时不是很方便,IDE有一个隐藏的功能已经为我们提供了这个便捷一.进入webview页面二.webview页面 ...
微信开发者工具之页面跳转
1.声明式页面导航(跳转): //跳转到tabBar页面 <navigator url="路径" open-type="switchTab">打开t ...
如何使用微信开发者工具调试在微信端访问的网页
假设我用vue开发了一个web应用,需要在手机微信里访问并调试, 可以按照本文介绍的步骤,使用微信开发者工具来调试. 假设我的web应用的访问入口是如下公众号菜单的"预约"按钮: ...
历史微信开发者工具_不用微信开发者工具也能调试微信页面
一般调试微信页面的时候,我们都会按照微信开发的官网教程,让你去安装微信开发者工具,然后在微信开发者工具上调试, 这样有时候会不会感觉很麻烦? 而且这个工具还经常卡死. 1515737321133.jp ...
《从0到1上线微信小游戏》第八节在微信开发者工具和手机上调试
第八节在微信开发者工具和手机上调试下载和配置微信开发者工具构建运行在微信开发者工具上调试在手机上测试虽然游戏能在Cocos Creator引擎的模拟器上正常运行,但这不代表移植到小程序上运 ...
UniCloud 入门及发布微信开发者工具进行预览
UniCloud 入门及发布微信开发者工具进行预览关于unicloud和原生微信云开发小记之前一直有疑问的是,在进行微信云开发了解的时候.必须通过微信开发者工具来进行云服务的设置.为什么unicl ...

使用微信开发者工具的调试器

以下是使用微信开发者工具的调试器介绍

我平常调试接口的步骤：

使用微信开发者工具的调试器相关推荐

最新文章

热门文章