How to View URL Query Parameters using Browser Dev Tools

I was testing a system that created particularly long URLs that were hard to read because there were so many query parameters. I needed a way to fix that.

I was just about to write a small tool to parse the url and show me the query parameters in a nice view, and then thought to ask myself… can the dev tools do this already?

Yes they can.

• Chrome - network tab, click on the request, headers, look at the bottom to see the query params
• Safari - network tab, click on the request, headers, look at the bottom to see the query params
• Edge - network tab, click on the request, parameters, to see the query params
• Firefox - network tab, click on the request, params, to see the query params

A quick tip for easily viewing URL query parameters.

Free Video Showing How to View Query Params