Subscribe to RSS Feed

WebSocket monitor is an extension to Firefox developer tools that can be used to monitor WebSocket connections in Firefox. It allows inspecting all data sent and received.

It's been a while since we published first version of our add-on for inspecting WebSocket traffic and it's good time to summarize all new features and show how it's integrated with Firefox Developer tools.

Download signed version of this add-on from AMO. The source code with further documentation is available on github.

WebSocket Monitor can be used to track any WS connection, but following protocols have an extra support: Socket.IO, SockJS, Plain JSON, WAMP, MQTT.



(click to enlarge)

Introduction

After the add-on is installed, open Firefox Developer Tools (F12 on Win or ⌥⌘I on OSX) and switch into a new Web Sockets panel. The panel displays list of frames sent/received by all WebSockets connections on the current page as well as Connect and Disconnect events.

The screenshot above shows one Connect event, one Sent frame and one Received frame. There is also a summary at the bottom of the list showing number of frames in the list, total size of transferred payload and total time since the first frame.

The screenshot below shows content of the side panel that displays all details of the selected packet.

Filtering

The extension allows simple filtering of the frame list. It's possible to filter using a keyword where only frames with the keyword in the payload are displayed. Or you might pick a connection ID and see only frames sent/received through that connection.

Protocols

WebSocket Monitor allows inspecting any WS connection, but there is an extra support for the following protocols:

These protocols introduce an extra side bar with parsed payload. See the next screenshot that shows parsed SocketIO frame payload as an expandable tree allowing quick inspection.

Table and Chat Perspectives

There are two ways how to visualize frames. Apart from the Tabular View (see the screenshot above) there is also a Chat View that uses well know 'user-chat' approach (used in various messengers).

Inline Data Preview

Both perspectives offers also an inline data preview. You don't have to always select the frame and go to the side bar, just open the data directly in the frame.


There are more small and nifty features so, don't forget to checkout our wiki if you are interested!

Resources


Rss Commenti

No comments yet

No comments yet.

Sorry, the comment form is closed at this time.