31

There are some great Chrome extensions around for pretty-printing JSON (great SU question here: Google Chrome Plugin for JSON Reading), but they all seem to depend on detecting whether the incoming document is in a JSON format automagically.

Knowing that, the question is: How can I set it up so that I can pretty-print displayed JSON manually, rather than relying on some extension's magical detection (that may or may not fail to trigger when I need it to)?

I started from that SU post, and found some extensions:

(i.e., the results for JSON formatter). Those, and more, will all detect JSON formatting, and display it in a pretty-printed way, but none of them support an easy, bugproof way to manually turn it on on a page where JSON is not detected (except by, perhaps, tricking the engine by sticking format=json in the query string, but none of them were explicit about telling me I could do that).

Is there a better option out there?

Giacomo1968
  • 53,069
  • 19
  • 162
  • 212
A. Wilson
  • 613
  • 1
  • 6
  • 14
  • We don't do product recommendations unless prior research is shown (http://superuser.com/faq). please list the tools you have tried. I'd need to flag this as not useful. If you turn your question into "How can I do X?" it likely won't be deleted. Act now. – user 99572 is fine Mar 05 '13 at 20:42
  • From the closing: "We expect answers to be supported by facts, references, or specific expertise, but this question will likely solicit debate, arguments, polling, or extended discussion." It seems like the question, "Is there a plugin that allows pretty-printing to manually be enabled" is pretty straightforward, and easy to support with reference. Am I missing something here? – A. Wilson Mar 05 '13 at 23:19
  • 2
    Your question was reopened. – user 99572 is fine Mar 06 '13 at 21:57
  • Guess the accepted answer should just be "yes" then :P – jsh Sep 25 '15 at 19:47
  • 1
    That would make sense if the question didn't start with "How", but it does start that way, so I don't understand your reasoning. – A. Wilson Sep 29 '15 at 04:28

3 Answers3

19

JSON Formatter provides buttons to toggle between raw and formatted views of a JSON document.

It is open source. As of March 2023, the chrome extension was last updated on January 2023 and the last commit was in March 2023.

As of November 2016, the last commit was in March 2015. There are over 100 forks, many of which have more recent commits. It's not immediately clear if one of those forks is better maintained.

The OP of this answer originally wrote: "I feel like a big dummy. Some more thorough searching turned up https://chrome.google.com/webstore/detail/the-missing-json-inspecto/hhffklcokfpbcajebmnpijpkaeadlgfn/related, which is exactly what I need." However, an edited version of this answer indicated that that extension was not open source and was no longer maintained.

Matiboux
  • 3
  • 3
A. Wilson
  • 613
  • 1
  • 6
  • 14
  • 6
    That extension is not open source, and hasn't been maintained since 2013. [JSON Formatter](https://chrome.google.com/webstore/detail/json-formatter/bcjindcccaagfpapjjmafapmmgkkhgoa/related) is actively maintained, better rated, and open source. – Dan Dascalescu Nov 24 '15 at 23:58
  • To help find a more active (or better rated) fork, you might want to try https://techgaun.github.io/active-forks/index.html#https://github.com/callumlocke/json-formatter – user462982 Dec 07 '21 at 10:48
11

Here is a way with Chrome 97 and no plugins.

  1. Visit a API or JSON resource in the URL
  2. Open developer tools. (F12)
  3. Click the Source tab.
  4. Open a source or hit CTRL-P
  5. Select the JSON
  6. In the top, select Pretty Print
  7. You get nice JSON human-readable formatting!

Here is an example:

enter image description here

enter image description here

Jess
  • 885
  • 3
  • 9
  • 19
  • 6
    If you go to 'Network' instead you get an ever cleaner view in the 'Preview' tab – David Mulder Feb 23 '22 at 11:09
  • The pretty print option no longer seems to work? – Protector one Aug 31 '22 at 10:23
  • 1
    @Protectorone when you open the file, click on `{}` at the bottom to pretty print the file. You can also preview the file from Network tab as @david-mulder mentioned but you will need to refresh the page if you went into developer tools after the page was loaded. – Praveen Lobo Jan 09 '23 at 15:46
3

I ran into the same problem and dislike the bloated-ware so I develop Jipy It simply ask you to highlight (full or partial) JSON payload and trigger the format function. (hotkey, context-menu, or button)

TLJ
  • 131
  • 3