• Skip to primary navigation
  • Skip to main content
Sal Ferrarello
  • About Sal Ferrarello
  • Speaking
  • Connect
    Mastodon GitHub Twitter (deprecated)
You are here: Home / Dev Tips / Pretty Print JSON URL

Pretty Print JSON URL

Last updated on May 20, 2023 by Sal Ferrarello

I work a lot with JSON endpoints and having a browser extension to pretty print the JSON response is invaluable. However, sometimes I’m using a different machine (or guiding someone on their machine) and rather than asking them to install a browser extension, I use this trick. If the user is on the page displaying the JSON response, running this command in the browser console will pretty print the response await (await fetch(window.location.href)).json().

Pretty Print JSON from URL Example

For example, if you visit my Mastodon account and request the JSON response https://phpc.social/@salcode.json, you’ll see a page of code that is difficult to read.

If you then run

await (await fetch(window.location.href)).json()

from the browser console, you’ll get a nicely formatted JSON object in the browser console and you can expand or collapse parts of the object.

Browser Extension

On Google Chrome, I’m a fan of the JSONVue extension, which makes running the above command unnecessary.

Sal Ferrarello
Sal Ferrarello (@salcode)
Sal is a PHP developer with a focus on the WordPress platform. He is a conference speaker with a background including Piano Player, Radio DJ, Magician/Juggler, Beach Photographer, and High School Math Teacher. Sal can be found professionally at WebDevStudios, where he works as a senior backend engineer.

Filed Under: Dev Tips, Solution Tagged With: JSON, REST API, web browser

Reader Interactions

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

Copyright © 2023 · Bootstrap4 Genesis on Genesis Framework · WordPress · Log in