无需登录 数据私有 本地保存

WebSocket 消息检查器 - 拦截并可视化收发数据

开发工具 调试 WebSocket 拦截 消息 调试
1
0
0
0
未连接 0 0 00:00
嗅探模式已激活 — 正在拦截页面中新创建的WebSocket连接

等待WebSocket消息

连接一个WebSocket服务器或启用嗅探模式开始拦截消息

Postman Echo WebSocket Echo IfElse Echo

WebSocket 消息检查器 - 常见问题与知识

什么是 WebSocket 消息检查器？
WebSocket 消息检查器是一款浏览器端调试工具，用于实时拦截、记录和可视化 WebSocket 双向通信数据。它可以帮助开发者查看每条发送和接收的消息内容、时间戳、大小等详细信息，是 WebSocket 应用开发中不可或缺的调试利器。支持直接连接模式和页面嗅探模式两种工作方式。
如何使用嗅探模式拦截页面的 WebSocket 流量？
开启"嗅探模式"开关后，工具会重写浏览器原生 window.WebSocket 构造函数，代理所有后续创建的 WebSocket 连接。代理层会拦截 send() 和 onmessage 事件，将所有消息实时显示在检查器中。注意：嗅探模式只能拦截开启之后新创建的连接，已存在的连接无法被拦截。刷新页面后重新开启即可捕获所有连接。
WebSocket 与 HTTP 轮询有什么区别？
WebSocket 是全双工通信协议，建立连接后客户端和服务器可以随时互相发送数据，无需重复建立连接，延迟极低。HTTP 轮询（包括长轮询）需要客户端不断发起请求，每次都有 HTTP 头部开销，实时性和效率不如 WebSocket。WebSocket 特别适合实时聊天、在线游戏、金融行情等高频低延迟场景。
WebSocket 的连接状态码有哪些含义？
WebSocket 关闭码（Close Code）常见值：1000 正常关闭；1001 端点离开（如页面关闭）；1006 连接异常断开（无法传递关闭帧）；1008 协议错误；1011 服务器内部错误。ReadyState 状态：0 CONNECTING 连接中；1 OPEN 已连接；2 CLOSING 关闭中；3 CLOSED 已关闭。工具会在消息区域显示这些状态变化。
为什么连接失败提示"连接被拒绝"或超时？
常见原因包括：① URL 拼写错误或协议错误（应为 ws:// 或 wss://）；② 服务器未开启或端口被防火墙拦截；③ 跨域策略限制（虽然 WebSocket 本身不受同源策略严格限制，但服务器可能验证 Origin 头部）；④ 代理或 VPN 干扰了 WebSocket 握手；⑤ 证书问题（wss:// 需要有效 SSL 证书）。建议先使用公共测试服务器验证工具是否正常工作。
如何分析 WebSocket 消息的性能和大小？
本工具在每条消息旁显示消息大小（字节数）和时间戳。对于性能分析：关注消息频率是否过高、单条消息是否过大（超过 16KB 建议压缩）、连接时长内的消息总量。可以使用导出功能将消息日志保存为 JSON 文件，进行离线分析。配合浏览器开发者工具的 Network 面板中的 WS 标签可以获得更底层的帧级别信息。
WebSocket 消息支持哪些数据格式？
WebSocket 支持文本帧（UTF-8 字符串）和二进制帧（Blob 或 ArrayBuffer）。本工具自动检测 JSON 格式并美化显示，对于二进制数据会以 Base64 和十六进制形式展示。常见应用协议包括：JSON（最常用）、MessagePack、Protobuf、自定义文本协议等。发送时可以输入任意文本或 JSON 字符串。
如何保障 WebSocket 通信安全？
① 始终使用 wss://（WebSocket over TLS）加密传输，防止中间人攻击；② 在连接 URL 中携带 token 或使用 cookie 进行身份验证；③ 服务器端验证 Origin 头部，防止跨站点 WebSocket 劫持；④ 对输入消息进行严格校验，防止注入攻击；⑤ 设置合理的超时和心跳机制，及时清理僵尸连接；⑥ 使用子协议（如 STOMP、MQTT over WS）规范消息格式。
浏览器开发者工具如何查看 WebSocket？
Chrome/Edge：打开 F12 开发者工具 → Network 标签 → 筛选 WS → 点击 WebSocket 连接 → 查看 Messages 子标签，可以看到每帧的方向、时间和内容。Firefox：同样在 Network 标签中筛选 WS。本工具提供了更友好的可视化界面，支持嗅探模式拦截、消息搜索过滤、JSON 格式化、导出日志等增强功能，适合频繁调试的场景。
什么是 WebSocket 心跳机制（Ping/Pong）？
WebSocket 协议内置了 Ping/Pong 控制帧用于保活检测。服务器发送 Ping 帧后，客户端必须回复 Pong 帧。虽然浏览器 JavaScript API 无法直接发送 Ping 帧，但许多应用在应用层实现心跳（如定时发送 {"type":"ping"} 消息）。本工具支持应用层心跳，可以在连接配置中设置心跳间隔和消息内容，自动维持连接活跃。
🔧 相关工具