A Practical Way to Debug Broken API JSON with a Formatter
When an API returns minified JSON and a vague parse error, don't start by blaming the backend. This guide walks through a three-step JSON formatter workflow, plus a common-error cheat sheet and checklist.
You finish an API change late at night. A frontend teammate pings you: "the response won't parse," with a single line of minified JSON attached. Almost everyone who ships APIs has been here — the error is often just Unexpected token, with no clear field or line number.
You don't have to guess. Paste the payload into the JSON Formatter, expand the structure, run validation, and you can usually pinpoint the issue in seconds. This article documents the three-step flow we use when debugging API JSON.
Why minified JSON is hard to read
Production JSON is usually compressed onto one line. Brackets and commas are nearly impossible to scan by eye. JSON.parse errors often give only a character offset, for example:
Uncaught SyntaxError: Unexpected token } in JSON at position 187
That position 187 is an offset into the raw string. Once everything is on one line, it is almost useless for finding "which field."
A saying on our team: one extra comma or one missing quote can ruin a night — but formatting usually finds the bug in about fifteen seconds.
The three-step workflow
- Format first so the structure is readable
- Validate to get an exact error location
- Minify again before you paste into tickets or chat
Step 1: Format and expand the structure
Paste the raw response and click Format. The tool re-indents the JSON with syntax highlighting so nesting is obvious. Take this broken response:
{"code":0,"data":{"userId":1024,"roles":["admin","editor"],"profile":{"nickname":"Yaya","avatar":"https://cdn.example.com/a.png",}}}
After formatting you can immediately see the trailing comma after profile — one of the most common JSON syntax mistakes. Everything runs locally in the browser, so sensitive payloads never leave the device.
Step 2: Validate for a precise error position
If formatting fails, click Validate. Under the hood it uses JSON.parse and shows the browser's native error, including the character position. Jump to that offset in the formatted text and you can usually lock onto a single field.
Step 3: Minify before sharing
After you fix the issue, don't paste multi-line formatted JSON into tickets — it is noisy, and some systems eat newlines. Use Minify to collapse it back to one line for logs, tickets, or storage fields.
Common JSON error cheat sheet
| Error keyword | Likely cause | What to check |
|---|---|---|
Unexpected token } |
Trailing comma in an object or array | After formatting, check for a , after the last field/item |
Unexpected end of JSON input |
Truncated payload / unclosed brackets | Confirm the full response body and any client-side chunking |
Unexpected token ' |
Single quotes instead of double quotes | JSON strings must use double quotes |
Unexpected non-whitespace character |
Extra content after the JSON | Common when a log prefix or timestamp is glued on |
Unexpected token u |
undefined serialized into JSON |
Backend should emit null, not undefined |
Pre-flight checklist
Before you paste into the formatter, skim this list:
- Strings use double quotes, not single quotes or bare words
- No trailing commas after the last object/array item
-
{}and[]are balanced - No non-JSON prefix/suffix (log lines, HTML error pages)
- Numeric fields were not accidentally quoted as strings
Handy tool combinations
- For JWT auth, decode the payload with Base64, then format the JSON claims.
- If you suspect stale cache, hash both responses with the Hash Generator and compare.
- If the error contains percent-encoding (like
%7B%22code%22), decode it with URL Encode first, then format.
All of these tools run entirely in the browser, which is ideal when the payload includes user or auth fields.
Closing
Most "JSON parse failed" incidents come down to one comma, one quote, or a little extra text. Formatting first, then validating for an exact position, is almost always faster than counting brackets in a one-line blob. Keep this workflow and cheat sheet handy for the next late-night alert.