I’ve been a long time fan of Wireshark for sniffing HTTP traffic between client/server. I’ve even used it to track down the IP address of a host flooding a network with UDP packets. It’s just a useful tool all around. When working on getting the Grizzly WebSocket implementation passing the Autobahn test suite however, there was no dissector (the entity responsible for parsing a “network packet”) for WebSockets – so it was a little tedious at times trying to pick the frames apart manually. However, it seems in one of the recent updates (I’m using 1.8.1 by the way), a WebSocket dissector was added. Needless to say, I was very happy to see this.
Here’s an example of a simple conversation captured with Wireshark:
Here you can see the overview of the conversation. The initiating GET, followed by the request being upgraded to a WebSocket connection, followed by several websocket frames (both client – MASKED, and server).
Typically, you may be interested in a particular conversation. If you’re capturing all data to a particular port, it can be difficult to follow a particular conversation. WireShark makes this an easy problem to deal with. You can right-click on a particular packet and follow the stream your interested in:
Which will yield the raw representation of the entire stream:
One other thing to notice is that once you close this window out, this conversation will be the only one in the overview that we showed earlier – the other conversations have now been filtered out.
This is all well and good, but the raw view isn’t particularly helpful when looking at the websocket frames. In order to drill down into the frame details, you can select the frame of interest in the overview, and then drill down to the nitty gritty details:
The fin bit, opcode, mask bit, etc. is all there for easy inspection including the masked and unmasked payload. Pretty handy for debugging if you ask me.