如何在基于 Web 的应用中进行调试

欧雷发表于 2022-12-24 10:08:47

虽然之前写过一篇《如何调试一个页面》，但里面有的内容已经过时，且不够全面；本篇笔记要弥补它的缺点，尽量覆盖更多场景，且与时俱进。

HTTP 请求

对 HTTP 请求的调试发生在串起用户操作与后端逻辑的流程中，根据前后端开发的完成状态，可分为以下几种情况——

理想状况下，也就是在需求、交互与界面、HTTP API 定义等前置条件都已确定并几乎没有什么变更时，一般来说某个业务模块的前端部分会比后端开发得快一些，尤其是在 Handie 之类配置化/低代码开发框架的加持下。

这时，前端在开发完成并按照 HTTP API 定义对接好请求之后，可以先发到测试环境；待后端开发人员写完相应代码实现时，可经由 Proxy SwitchyOmega 这类浏览器插件将测试环境的 HTTP API 请求代理到本地服务，通过实际的界面操作来测试并调试后端代码实现得是否正确。

TBD

当不在一个局域网内时，后端开发人员需用 cpolar、ngrok 等配置内网穿透后将工具提供的域名发给前端开发人员，前端连这个域名进行联调。

混合应用依赖于原生应用的机制，因而调试起来有些不便，需要借助于网络代理工具。

具体的调试方式上，有以下两种——

一些必要的在原生应用中设置的环境变量需要对在原生应用中发起的 HTTP 请求进行抓包才能获取。

拿到所需环境变量后，在本地 Web 应用中写死进代码中进行调试。

将线上文件映射到本地文件上。

创作不易，若给你提供了价值，还请不吝为欧雷充电

左为微信，右为支付宝；充电累计 ¥88 以上可在付款时备注或邮件告知昵称和需要被链接的网址，会列在「赞助」页。其他方式与具体规则请见「资助」。