是否有一种方法或扩展,让我观察“流量”通过WebSocket?出于调试目的,我希望看到客户端和服务器的请求/响应。
当前回答
你有3个选项:Chrome(通过开发人员工具->网络选项卡),Wireshark和Fiddler(通过日志选项卡),但他们都非常基本。如果你有非常大的流量,或者每帧都非常大,使用它们进行调试就变得非常困难。
然而,你可以使用Fiddler和FiddlerScript来检查WebSocket流量,就像检查HTTP流量一样。这个解决方案的优点是你可以利用Fiddler中的许多其他功能,比如多个检查器(HexView, JSON, SyntaxView),比较数据包,查找数据包等。
请参考我最近在CodeProject上写的文章,这篇文章向你展示了如何用Fiddler(用FiddlerScript)调试/检查WebSocket流量。http://www.codeproject.com/Articles/718660/Debug-Inspect-WebSocket-traffic-with-Fiddler
其他回答
如果你没有访问websocket的页面,你可以打开Chrome控制台并输入你的JavaScript:
var webSocket = new WebSocket('ws://address:port');
webSocket.onmessage = function(data) { console.log(data); }
这将打开web套接字,这样您就可以在网络选项卡和控制台中看到它。
你有3个选项:Chrome(通过开发人员工具->网络选项卡),Wireshark和Fiddler(通过日志选项卡),但他们都非常基本。如果你有非常大的流量,或者每帧都非常大,使用它们进行调试就变得非常困难。
然而,你可以使用Fiddler和FiddlerScript来检查WebSocket流量,就像检查HTTP流量一样。这个解决方案的优点是你可以利用Fiddler中的许多其他功能,比如多个检查器(HexView, JSON, SyntaxView),比较数据包,查找数据包等。
请参考我最近在CodeProject上写的文章,这篇文章向你展示了如何用Fiddler(用FiddlerScript)调试/检查WebSocket流量。http://www.codeproject.com/Articles/718660/Debug-Inspect-WebSocket-traffic-with-Fiddler
Chrome开发工具允许看到握手请求在打开连接期间保持等待,但据我所知,你不能看到流量。但是你可以闻一下。
他们似乎在不断地改变Chrome中的东西,但这里是目前有效的:-)
首先你必须点击红色记录按钮,否则你什么也得不到。 我以前从未注意到WS,但它过滤掉了web套接字 连接。 选择它,然后你可以看到帧(现在称为消息),它将向你显示错误消息等。
Chrome开发工具现在有能力列出WebSocket帧,也检查数据,如果帧不是二进制的。
过程:
启动Chrome开发工具 加载页面并启动WebSocket连接 单击“网络”页签。 从左边的列表中选择WebSocket连接(它的状态为“101交换协议”)。 单击Messages子选项卡。二进制帧将显示长度和时间戳,并指示它们是否被屏蔽。文本帧将显示也包括有效载荷内容。
如果您的WebSocket连接使用二进制帧,那么您可能仍然需要使用Wireshark来调试连接。Wireshark 1.8.0为WebSockets增加了解析器和过滤支持。在另一个答案中可以找到另一种答案。
推荐文章
- 很好的初学者教程socket.io?
- 如何禁用谷歌翻译从HTML在Chrome
- Chrome开发工具:如何找出什么是覆盖CSS规则?
- 资源解释为样式表,但以MIME类型text/html传输(似乎与web服务器无关)
- Chrome iOS(和Safari)的远程调试
- 在Chrome中模拟有限的带宽?
- 资源解释为文档,但使用MIME类型application/zip传输
- 如何让Chrome允许混合内容?
- 了解Chrome网络日志“停滞”状态
- 如何卸载Service Worker?
- jQuery ' .is(":visible") '在Chrome中无效
- 如何保存样式面板的CSS Chrome开发工具的变化?
- 当你双击日文文本时,Chrome如何决定突出显示什么?
- Chrome不会删除会话cookie
- 在Chrome和Firefox中用Javascript报告的神秘的“脚本错误”