是否有一种方法或扩展,让我观察“流量”通过WebSocket?出于调试目的,我希望看到客户端和服务器的请求/响应。
当前回答
Chrome 29及以上版本的简短回答:
打开调试器,转到“网络”选项卡 使用websocket加载页面 单击带有服务器升级响应的websocket请求 选择标签“帧”查看websocket帧 再次单击websocket请求刷新帧
其他回答
其他答案涵盖了最常见的场景:观察帧的内容(开发人员工具->网络选项卡->右击websocket连接->帧)。
如果你想知道更多的信息,比如哪些套接字当前打开/空闲或能够关闭它们,你会发现这个url很有用
chrome://net-internals/#sockets
你有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
至于我开始使用的工具,我建议firecamp Its like Postman,但它也支持websockets和socket.io。
Chrome开发工具允许看到握手请求在打开连接期间保持等待,但据我所知,你不能看到流量。但是你可以闻一下。
我只是发布这篇文章,因为Chrome改变了很多,没有一个答案是最新的。
开放开发工具 刷新您的页面(以便网络选项卡捕获WS连接) 点击你的请求 点击“帧”子选项卡 你应该会看到如下内容:
推荐文章
- 在JS的Chrome CPU配置文件中,'self'和'total'之间的差异
- 谷歌chrome扩展::console.log()从后台页面?
- 未捕获的SyntaxError:
- Access-Control-Allow-Origin不允许Origin < Origin >
- 如何设置断点在内联Javascript在谷歌Chrome?
- Chrome调试-打破下一个点击事件
- 谷歌Chrome表单自动填充和它的黄色背景
- 如何处理“未捕获(在承诺)DOMException:播放()失败,因为用户没有首先与文档交互。”在桌面与Chrome 66?
- 强制DOM重绘/刷新Chrome/Mac
- 我如何才能使setInterval也工作时,一个标签是不活跃的Chrome?
- 我如何调试一个HTTP POST在Chrome?
- 我如何从谷歌Chrome扩展获得当前选项卡的URL ?
- 调试WebSocket在谷歌Chrome
- 如何在浏览器中检查消失的元素?
- 超出ResizeObserver循环限制