如何使用Firebug或其他方法查看WS / WSS Websocket请求内容？

Question

有没有办法查看Websocket流量？

初始握手时只能看到Websocket标头。

回复后一切都消失了：

Connection  Upgrade
Sec-WebSocket-Accept    EQqklpK6bzlgAAOL2EFX/nx8bEI=
Upgrade WebSocket

我已经尝试过Firebug，Live Headers和Fiddler2来跟踪交换，他们都停止在那里登录。

Answer 1

试用Chrome的开发者工具

1. 点击“广告联盟”标签
2. 使用底部的过滤器仅显示WebSocket连接，
3. 选择所需的websocket连接，
4. 请注意，有“标题”，“预览”，“响应”等子标签 在右边，
5. 一旦数据开始流动，将出现'WebSocket Frames'子选项卡。 记录沿任一方向的所有数据。非常有用。

Answer 2

截至2014年9月3日，FireBug中的WebSocket调试似乎位于软管中：https://getfirebug.com/wiki/index.php/Firebug_2.0_Roadmap#Feature_Overview。但没有提到发布日期。

---

更新2017-11-24 Firefox中的插件系统发生了变化。 Websocket Monitor正处于不可用的时刻:(

---

更新2016-04-06

使用Firefox开发工具的Websocket Monitor插件最终可以在Firefox中进行WebSocket调试！它由Firebug开发团队开发，其来源可以找到here。

---

更新2015-10-28

Firefox开发人员工具产品经理Jeff Griffiths：

  

平台支持今晚在夜间＆amp;正在处理一个原型加载项：https://github.com/firebug/websocket-monitor

https://twitter.com/canuckistani/status/659399140590284800

Firefox Bugzilla上的相关功能请求：https://bugzilla.mozilla.org/show_bug.cgi?id=1203802

---

自2015-04-08更新

Fiddler 4.5现在可以本地检查WebSocket流量。

---

更新2014-09-11

关于Firebug问题跟踪器上的this comment：

  

当Firebug团队正在努力时，它目前还没有被关注   目前将Firebug与DevTools集成在一起。这意味着它   将能够重用内置DevTools提供的功能。   因此，您可以关注https://bugzil.la/885508。

Answer 3

当前版本的Fiddler可以很好地处理WebSocket流量。见http://blogs.msdn.com/b/fiddler/archive/2011/11/22/fiddler-and-websockets.aspx

有关如何将数据放在Log标签上的信息，请参见http://blogs.telerik.com/fiddler/posts/13-06-04/what-s-new-in-fiddler-2-4-4-5。

要在WebSockets选项卡上显示数据，

你需要一个扩展（这个版本将被内置于2.5版本）。现在，你可以抓住current bits。只需解压缩ZIP并将两个文件放入\Fiddler2\Scripts文件夹并重新启动Fiddler。如果双击Fiddler的WebSessions列表中的WebSocket会话，将出现WebSockets选项卡

Answer 4

有WebSocket Monitor - Firefox开发人员工具的扩展，可用于监控WebSocket连接

安装扩展程序后，打开Firefox开发人员工具并切换到“Web套接字”＆＃39;面板。它显示当前页面的WS帧流量。对以下协议有额外支持：

• Socket IO
• SockJS
• WAMP
• Plain JSON

Answer 5

不像这里提到的其他选项那么舒服，但是可以在各种情况下帮助您的通用工具：使用wireshark。有了一些关于TCP的知识，您可以调试其他工具提到的无法解决的问题（意外断开连接......），因为它们的工作级别太高。你也可以（就像在Firebug中一样）阅读实际的websocket消息。

wireshark的缺点是使用加密连接相当麻烦。

尝试一下，我一直用它来调试一个与Python websocket后端通信的Rails应用程序。

Answer 6

我发布了有关使用Chrome和Wireshark调试WebSocket消息的更多详细信息：

https://blogs.oracle.com/arungupta/entry/logging_websocket_frames_using_chrome

Answer 7

在firefox中，您可以打开开发人员工具栏（Shift + F2）并在“网络”选项卡中查看websockets。您可以使用选项卡底部的过滤（为websockets选择Other）。