开发调试工具及技巧

端口映射工具Socat

应用场景：本地开发我们一般不会使用80和443这些端口启动服务，一是考虑安全问题，二是这些端口一般需要 root 权限启动，产生一些 root 权限的文件会带来一些麻烦。但是某些场景下(例如支持某些 CORS 条件)我们又需要进行测试，这时可以使用Socat进行端口映射。 安装：brew install socat 使用：sudo socat TCP-LISTEN:80,fork TCP:127.0.0.1:8080

移动端调试工具vConsole

手机页面开发调试面板，包括：

1. 查看 console 日志
2. 查看网络请求
3. 查看页面 element 结构
4. 查看 Cookies、localStorage 和 SessionStorage
5. 手动执行 JS 命令行
6. 自定义插件

真机调试

Safari 真机调试

抓包&代理

Web 调试代理神器whistle

后端抓包&代理

应用场景：基于 Node 开发的服务依赖其他 HTTP 服务，模拟测试依赖服务异常(响应慢、响应错误、数据错误)

• Step1. whistle 资源准备
  1. 模拟响应数据，在 Values 面板中创建响应数据文件并填充 mock 数据，例:data.json
  2. 在 Rules 面板配置代理规则，例：example.com/api/getData resBody://{data.json} replaceStatus://200 resDelay://1000
  3. 启动 whistle
• Step2. 配置代理export http_proxy=http://127.0.0.1:8099 https_proxy=http://127.0.0.1:8099
• Step3. 启动服务npm run dev
• Step4. 修改 whistle 配置模拟各种情况，需要和 Step3 进行交叉测试，验证程序启动前和服务运行中依赖服务异常对程序的影响
  • 情况 1：模拟程序运行中依赖服务异常
  • 情况 2：模拟程序运行中依赖服务异常后恢复
  • 情况 3：模拟程序启动前依赖服务异常
  • 情况 3：模拟程序启动前依赖服务异常后恢复