乐闻世界logo
5月27日 21:46

whistle 如何支持 WebSocket 代理和调试？

核心答案

Whistle 基于代理机制自动拦截 WebSocket 连接，在 Network 面板的 Frames 标签中实时展示收发消息，配合规则可以实现暂停、忽略、Mock 等调试操作。

具体分三步：

1. 抓包查看消息

设置代理后，Whistle 自动捕获 ws/wss 请求。在 Network 面板选中该请求，切换到 Frames 标签即可看到实时消息流，JSON 消息会自动格式化。

2. 用规则控制连接行为

shell
# 暂停接收服务端消息
ws://example.com enable://pauseReceive

# 暂停发送客户端消息
ws://example.com enable://pauseSend

# 忽略收发（不转发）
ws://example.com enable://ignoreReceive
ws://example.com enable://ignoreSend

3. 用 Composer 构造和发送消息

在 Frames 面板底部有 Composer 区域，可以直接向服务端或客户端发送自定义文本/JSON 数据，用于模拟服务端推送或异常响应。

追问一：如何修改 WebSocket 消息内容？

Whistle 原生不支持直接改写 WebSocket 消息体，需要借助 frameScript 规则或插件：

  • frameScript：在 Rules 面板配置 ws://example.com frameScript://{wsModify.js}，脚本中监听 onframe 事件对帧数据做替换
  • 插件方式：安装 whistle.script 插件，配置 ws://example.com script://handleWS，在脚本中拦截并修改 message

追问二：Whistle 如何处理 wss 连接？

和 HTTPS 一样需要安装 Whistle 的根证书。证书装好后，Whistle 通过 MITM 方式解密 wss 流量，抓包和调试方式与 ws 完全一致。

追问三：如何 Mock WebSocket 服务端？

用 Composer 手动发消息是最快的方式。如需自动化，可以写插件监听 upgrade 事件，在 server.on('connection') 回调中按业务逻辑返回 Mock 数据，配置规则指向该插件即可。

标签：Whistle