How to view Web Socket request in the chrome dev tool in Blazor Server project

Question

We know that in Blazor Server project in .NET 6, everything is processed in the server and through web socket request the response is updated to the UI. Now as a Blazor Server developer, I wanted to see the web socket request in the browser dev tool. I tried to see the web socket request in the Chrome Dev Tool, but I don't see anything. Can anyone help me to know why we can't see the request in the Chrome Dev tool and how to configure to see the request.

Answer 1

In chrome web inspector open the network tab and click on the ws tab. Then click on the connection to see the message traffic (if you don’t see the connection just reload). You then need to click the message tab. The messages are in binary, so you need to click on a message to see the dump of the payload.

ms doesn’t document the message formats, so you will need to look at the source code to understand. In general the client sends events to the server and the server send razor render tree updates to the client.

https://github.com/dotnet/aspnetcore/tree/main/src/Components/Web.JS