日常调试中我常用的几款工具推荐(前端向)

9 阅读2分钟

日常调试中我常用的几款工具推荐(前端向)

在日常开发中,不管是调试网络请求、还原线上 bug、还是模拟异常场景,有几款工具我觉得特别好用,今天整理出来做个备忘,也希望对其他开发同学有帮助。

1. Charles:真正“看得见”的网络调试

Charles 是我最常用的一款 HTTP 抓包工具。虽然 Chrome DevTools 的 Network 面板也挺强,但一旦涉及:

  • 请求需要重发测试
  • 要修改请求体再发送
  • 要模拟慢网环境
  • 或者 HTTPS 内容需要解密查看

Charles 就显得不可替代了。

比如前阵子我在调试一个跨平台 APP 的登录接口,Android 端正常、iOS 端一直失败。用 Charles 一抓,发现 iOS 那边少传了一个 token 字段,前端逻辑根本没带上 header。这种问题没 Charles 是定位不出来的。

Charles 还能模拟 2G/3G 网络场景,帮我们预先发现加载卡顿的问题,之前做性能优化就靠它复现出超时场景。

2. Postman:接口测试利器

虽然现在很多团队都上 Swagger 了,但我觉得 Postman 依然是 API 调试中非常直观的选择。特别是测试带签名、Token 校验、文件上传的复杂请求,配置一次能反复用很省事。

还有团队协作功能、环境变量支持、Mock Server 等,熟练后真的香。

3. Wireshark:抓底层包用它没错

Wireshark 可能不是所有前端都会用,但我之前遇到请求卡在 DNS 阶段,或者被运营商劫持的时候,还是得靠它看底层 TCP/UDP 包的细节。适合网络更底层的问题排查。


最后总结:不同工具适合不同问题场景。 调接口首选 Charles,改参数 Postman,上底包 Wireshark,组合拳出击,才不慌。