[{"data":1,"prerenderedAt":9770},["ShallowReactive",2],{"blog-list-en":3},[4,1014,2229,3359,4477,5546,6571,7565,8881],{"id":5,"title":6,"author":7,"body":8,"category":991,"date":992,"description":993,"draft":994,"extension":995,"h1":15,"image":996,"lastmod":992,"locales":997,"meta":999,"navigation":1000,"path":1001,"promo":1002,"seo":1006,"stem":1007,"tags":1008,"__hash__":1013},"blog\u002Fen\u002Fblog\u002Funexpected-end-of-json-input.md","Unexpected End of JSON Input: Causes and Fixes","JSON Toolbox Team",{"type":9,"value":10,"toc":958},"minimark",[11,16,27,36,47,62,70,75,86,89,97,104,109,117,123,134,157,161,324,350,354,357,361,368,374,378,384,394,398,401,407,480,484,490,493,497,503,509,513,520,526,529,569,572,576,579,585,590,596,599,605,611,615,618,626,643,663,667,670,688,691,707,716,719,723,728,762,767,798,802,805,810,814,817,821,827,831,834,838,857,861,868,872,882,886,889,896,913,917],[12,13,15],"h1",{"id":14},"unexpected-end-of-json-input-what-it-means-and-how-to-fix-it","Unexpected End of JSON Input: What It Means and How to Fix It",[17,18,24],"pre",{"className":19,"code":21,"language":22,"meta":23},[20],"language-text","SyntaxError: Unexpected end of JSON input\n    at JSON.parse (\u003Canonymous>)\n","text","",[25,26,21],"code",{"__ignoreMap":23},[28,29,30,31,35],"p",{},"This error says one thing: ",[32,33,34],"strong",{},"the parser reached the end of the string while it was still expecting more."," It never found the closing piece it needed, so it gave up at the last character.",[28,37,38,39,42,43,46],{},"The useful part is that the message narrows the cause considerably. An empty API response, a truncated download, and a missing ",[25,40,41],{},"}"," are three different problems that need three different fixes — and on modern JavaScript engines they do not even produce the same message. This guide shows how to tell them apart in about a minute, and how to fix each one in ",[25,44,45],{},"fetch()",", Node.js, React, and file reads.",[48,49,50],"blockquote",{},[28,51,52,55,56,61],{},[32,53,54],{},"Paste it and see where it breaks:"," the ",[57,58,60],"a",{"href":59},"\u002Ftools\u002Fformat\u002Fjson-repair","JSON Repair"," tool fixes missing brackets, trailing commas, and quoting problems in your browser, and reports an error instead of guessing when a document cannot be recovered.",[28,63,64,65,69],{},"For the wider picture — ten parse errors, not just this one — see ",[57,66,68],{"href":67},"\u002Fblog\u002Fjson-parse-error-debug","JSON Parse Failed: 10 Common API Errors and How to Debug Them",".",[71,72,74],"h2",{"id":73},"what-does-unexpected-end-of-json-input-mean","What does \"Unexpected end of JSON input\" mean?",[28,76,77,85],{},[57,78,82],{"href":79,"rel":80},"https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FJavaScript\u002FReference\u002FGlobal_Objects\u002FJSON\u002Fparse",[81],"nofollow",[25,83,84],{},"JSON.parse()"," reads a string and expects exactly one complete JSON value. If the string ends before that value is finished, parsing fails.",[28,87,88],{},"On current V8 (Node 20+, Chrome, Edge), these all produce the message:",[17,90,95],{"className":91,"code":93,"language":94,"meta":23},[92],"language-js","JSON.parse('')        \u002F\u002F SyntaxError: Unexpected end of JSON input\nJSON.parse('   ')     \u002F\u002F SyntaxError: Unexpected end of JSON input\nJSON.parse('[1,')     \u002F\u002F SyntaxError: Unexpected end of JSON input\nJSON.parse('{\"a\":')   \u002F\u002F SyntaxError: Unexpected end of JSON input\nJSON.parse('tru')     \u002F\u002F SyntaxError: Unexpected end of JSON input\n","js",[25,96,93],{"__ignoreMap":23},[28,98,99,100,103],{},"The pattern: in every case the parser was ",[32,101,102],{},"expecting a value"," and the input ran out — the string was empty, it was only whitespace, or it ended right after a comma, a colon, or mid-literal.",[105,106,108],"h3",{"id":107},"when-you-get-a-different-message-instead","When you get a different message instead",[28,110,111,112,116],{},"A document that is cut off ",[113,114,115],"em",{},"after"," a complete value produces a different, more specific error with a position:",[17,118,121],{"className":119,"code":120,"language":94,"meta":23},[92],"JSON.parse('{\"a\": 1')      \u002F\u002F SyntaxError: Expected ',' or '}' after property value in JSON at position 7\nJSON.parse('[1, 2')        \u002F\u002F SyntaxError: Expected ',' or ']' after array element in JSON at position 5\nJSON.parse('{\"a\": \"bc')    \u002F\u002F SyntaxError: Unterminated string in JSON at position 9\nJSON.parse('{\"a\":1,')      \u002F\u002F SyntaxError: Expected double-quoted property name in JSON at position 7\n",[25,122,120],{"__ignoreMap":23},[28,124,125,126,129,130,133],{},"So if you are looking at exactly ",[25,127,128],{},"Unexpected end of JSON input"," on a current engine, suspect ",[32,131,132],{},"empty input"," first, not a missing brace. Two caveats:",[135,136,137,148],"ul",{},[138,139,140,143,144,147],"li",{},[32,141,142],{},"Older engines differ."," Before V8's improved JSON errors, a truncated document like ",[25,145,146],{},"{\"a\": 1"," also reported \"Unexpected end of JSON input\". If you are on an older runtime or see this message in a library's logs, a missing bracket is still a candidate.",[138,149,150,153,154,69],{},[32,151,152],{},"Other engines word it differently."," Firefox reports its own message, along the lines of ",[25,155,156],{},"JSON.parse: unexpected end of data at line 1 column 1",[71,158,160],{"id":159},"common-causes-at-a-glance","Common causes at a glance",[162,163,164,180],"table",{},[165,166,167],"thead",{},[168,169,170,174,177],"tr",{},[171,172,173],"th",{},"Cause",[171,175,176],{},"Typical symptom",[171,178,179],{},"How to confirm",[181,182,183,210,236,253,291,304],"tbody",{},[168,184,185,191,204],{},[186,187,188],"td",{},[32,189,190],{},"Empty response body",[186,192,193,196,197,200,201],{},[25,194,195],{},"204 No Content",", or an endpoint that returns nothing after a successful ",[25,198,199],{},"DELETE","\u002F",[25,202,203],{},"POST",[186,205,206,209],{},[25,207,208],{},"text.length === 0","; status is 204\u002F205",[168,211,212,217,227],{},[186,213,214],{},[32,215,216],{},"Whitespace-only body",[186,218,219,220,223,224],{},"Body is ",[25,221,222],{},"\" \""," or ",[25,225,226],{},"\"\\n\"",[186,228,229,232,233],{},[25,230,231],{},"text.trim().length === 0"," but ",[25,234,235],{},"text.length > 0",[168,237,238,243,246],{},[186,239,240],{},[32,241,242],{},"Truncated response",[186,244,245],{},"Timeout, proxy buffer limit, body-size cap killed the transfer",[186,247,248,249,252],{},"Received bytes \u003C ",[25,250,251],{},"Content-Length","; ends mid-value",[168,254,255,260,273],{},[186,256,257],{},[32,258,259],{},"Unclosed structure in hand-written JSON",[186,261,262,263,265,266,269,270],{},"Missing ",[25,264,41],{},", ",[25,267,268],{},"]",", or closing ",[25,271,272],{},"\"",[186,274,275,276,265,279,265,282,265,284,287,288],{},"Ends with ",[25,277,278],{},"{",[25,280,281],{},"[",[25,283,272],{},[25,285,286],{},",",", or ",[25,289,290],{},":",[168,292,293,298,301],{},[186,294,295],{},[32,296,297],{},"File read before the write finished",[186,299,300],{},"Non-atomic write, or reading a streamed file too early",[186,302,303],{},"Retry the read and it works; file grows between reads",[168,305,306,314,317],{},[186,307,308],{},[32,309,310,311],{},"Parsing ",[25,312,313],{},"undefined",[186,315,316],{},"Value came from a missing variable or an unset field",[186,318,319,320,323],{},"Message is ",[25,321,322],{},"\"undefined\" is not valid JSON",", not this one",[28,325,326,327,330,331,334,335,338,339,342,343,345,346,349],{},"One counter-intuitive case worth knowing: ",[25,328,329],{},"JSON.parse(null)"," does ",[32,332,333],{},"not"," throw — ",[25,336,337],{},"null"," is coerced to the string ",[25,340,341],{},"\"null\""," and parses to ",[25,344,337],{},". ",[25,347,348],{},"JSON.parse(undefined)"," throws, but with a different message.",[71,351,353],{"id":352},"how-to-debug-empty-vs-truncated-vs-unclosed","How to debug: empty vs truncated vs unclosed",[28,355,356],{},"Work through these in order. Each step eliminates one of the three causes.",[105,358,360],{"id":359},"step-1-read-the-text-not-the-parsed-value","Step 1: Read the text, not the parsed value",[28,362,363,364,367],{},"Never debug this error through ",[25,365,366],{},"res.json()"," — it parses before you can look at anything. Read the body as text first:",[17,369,372],{"className":370,"code":371,"language":94,"meta":23},[92],"const res = await fetch(url)\nconst text = await res.text()\nconsole.log('status:', res.status, '| length:', text.length)\n",[25,373,371],{"__ignoreMap":23},[105,375,377],{"id":376},"step-2-is-it-empty","Step 2: Is it empty?",[17,379,382],{"className":380,"code":381,"language":94,"meta":23},[92],"if (text.trim().length === 0) {\n  \u002F\u002F Empty or whitespace-only: this is the classic cause of the message.\n  console.log('empty body, status', res.status)\n}\n",[25,383,381],{"__ignoreMap":23},[28,385,386,389,390,393],{},[25,387,388],{},"length === 0"," means no body at all. ",[25,391,392],{},"trim().length === 0"," with a non-zero length means whitespace only — a surprisingly common outcome when a server writes a newline.",[105,395,397],{"id":396},"step-3-inspect-the-tail","Step 3: Inspect the tail",[28,399,400],{},"The last characters tell you which failure you have:",[17,402,405],{"className":403,"code":404,"language":94,"meta":23},[92],"console.log(JSON.stringify(text.slice(-80)))\n",[25,406,404],{"__ignoreMap":23},[162,408,409,419],{},[165,410,411],{},[168,412,413,416],{},[171,414,415],{},"Ends with",[171,417,418],{},"What it means",[181,420,421,432,443,454,466],{},[168,422,423,429],{},[186,424,425,265,427],{},[25,426,278],{},[25,428,281],{},[186,430,431],{},"The structure was opened and never closed",[168,433,434,440],{},[186,435,436,439],{},[25,437,438],{},"\"a"," (an odd number of unescaped quotes)",[186,441,442],{},"A string was left unterminated",[168,444,445,451],{},[186,446,447,223,449],{},[25,448,286],{},[25,450,290],{},[186,452,453],{},"A value was expected and never arrived",[168,455,456,459],{},[186,457,458],{},"A complete value but no closing bracket",[186,460,262,461,223,463,465],{},[25,462,41],{},[25,464,268],{}," — usually a different error message with a position",[168,467,468,477],{},[186,469,470,471,223,474],{},"Mid-token, e.g. ",[25,472,473],{},"tru",[25,475,476],{},"12.",[186,478,479],{},"The document was cut off mid-value",[105,481,483],{"id":482},"step-4-compare-received-bytes-with-content-length","Step 4: Compare received bytes with Content-Length",[17,485,488],{"className":486,"code":487,"language":94,"meta":23},[92],"const declared = res.headers.get('content-length')\nconsole.log('declared:', declared, '| received:', new TextEncoder().encode(text).length)\n",[25,489,487],{"__ignoreMap":23},[28,491,492],{},"If you received fewer bytes than declared, the response was truncated in transit — a timeout, a proxy buffer limit, or a body-size cap. Re-fetch; do not try to parse half a document.",[105,494,496],{"id":495},"step-5-classify-it-automatically","Step 5: Classify it automatically",[28,498,499,500,502],{},"Run this only after ",[25,501,84],{}," has already failed — it classifies the tail of a broken string, it does not tell you whether a document is valid.",[17,504,507],{"className":505,"code":506,"language":94,"meta":23},[92],"function inspectJsonFailure(text) {\n  const trimmed = text.trim()\n\n  if (trimmed.length === 0) {\n    return { kind: 'empty', detail: 'The input is empty or whitespace only.' }\n  }\n\n  const last = trimmed[trimmed.length - 1]\n  if ('{[\",:'.includes(last)) {\n    return { kind: 'unclosed', detail: `Input ends with \"${last}\" — a value or closing bracket is missing.` }\n  }\n\n  return { kind: 'truncated', detail: 'Input ends mid-value. Compare received bytes with Content-Length.' }\n}\n",[25,508,506],{"__ignoreMap":23},[71,510,512],{"id":511},"how-to-fix-it-in-fetch","How to fix it in fetch()",[28,514,515,516,519],{},"The fix is to stop calling ",[25,517,518],{},".json()"," blindly. Read the text, handle the empty case, check the content type, then parse:",[17,521,524],{"className":522,"code":523,"language":94,"meta":23},[92],"async function fetchJson(url, init) {\n  const res = await fetch(url, init)\n  const text = await res.text()\n\n  \u002F\u002F 204 No Content and 205 Reset Content have no body by definition.\n  if (res.status === 204 || res.status === 205 || text.trim() === '') {\n    return null\n  }\n\n  const type = res.headers.get('content-type') || ''\n  if (!type.includes('application\u002Fjson')) {\n    throw new Error(`Expected JSON from ${url}, got \"${type || 'no content-type'}\"`)\n  }\n\n  try {\n    return JSON.parse(text)\n  } catch (err) {\n    throw new Error(`Invalid JSON from ${url} (${text.length} bytes): ${err.message}`)\n  }\n}\n",[25,525,523],{"__ignoreMap":23},[28,527,528],{},"Three details that matter:",[530,531,532,554,563],"ol",{},[138,533,534,542,543,545,546,553],{},[32,535,536,539,540],{},[25,537,538],{},"res.text()"," then ",[25,541,84],{},", not ",[25,544,366],{},". You cannot inspect a body you already parsed — and ",[57,547,550],{"href":548,"rel":549},"https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FResponse\u002Fjson",[81],[25,551,552],{},"Response.json()"," throws before you get a chance.",[138,555,556,559,560,562],{},[32,557,558],{},"A 204 is a success."," Do not treat it as an error; return ",[25,561,337],{}," (or whatever your code uses for \"no content\").",[138,564,565,568],{},[32,566,567],{},"Check the content type."," An HTML error page from a proxy returns 200 and parses as neither JSON nor an empty string — it fails with a different message, and this check makes the real problem obvious.",[28,570,571],{},"For truncated responses, the fix is not parsing: it is raising timeouts, lifting proxy body limits, or paginating the endpoint.",[71,573,575],{"id":574},"how-to-fix-it-in-nodejs","How to fix it in Node.js",[28,577,578],{},"Reading a file:",[17,580,583],{"className":581,"code":582,"language":94,"meta":23},[92],"import { readFile } from 'node:fs\u002Fpromises'\n\nconst text = await readFile('data.json', 'utf8')\n\nif (text.trim() === '') {\n  throw new Error('data.json is empty — the write did not complete')\n}\n\nconst data = JSON.parse(text)\n",[25,584,582],{"__ignoreMap":23},[28,586,587,588,290],{},"Parsing a request body — note that an empty body arrives as an empty string, not as ",[25,589,313],{},[17,591,594],{"className":592,"code":593,"language":94,"meta":23},[92],"\u002F\u002F Express\napp.post('\u002Fwebhook', express.json(), (req, res) => {\n  \u002F\u002F req.body is {} when the body is empty, not undefined\n  if (!req.body || Object.keys(req.body).length === 0) {\n    return res.status(400).json({ error: 'EMPTY_BODY' })\n  }\n  \u002F\u002F ...\n})\n",[25,595,593],{"__ignoreMap":23},[28,597,598],{},"Reading JSON that another process is still writing is the subtle version of this bug. Write atomically so a reader never sees a half-written file:",[17,600,603],{"className":601,"code":602,"language":94,"meta":23},[92],"import { writeFile, rename } from 'node:fs\u002Fpromises'\n\nconst target = 'data.json'\nconst tmp = `${target}.tmp`\n\nawait writeFile(tmp, JSON.stringify(data, null, 2), 'utf8')\nawait rename(tmp, target) \u002F\u002F atomic on the same filesystem\n",[25,604,602],{"__ignoreMap":23},[28,606,607,610],{},[25,608,609],{},"rename"," is atomic within a filesystem, so a concurrent reader sees either the old file or the new one — never a partial one.",[71,612,614],{"id":613},"how-to-fix-it-in-react-and-other-frontend-code","How to fix it in React and other frontend code",[28,616,617],{},"The usual cause in a component is parsing during the first render, before data exists — or parsing an empty response from an endpoint that returns nothing:",[17,619,624],{"className":620,"code":622,"language":623,"meta":23},[621],"language-jsx","function ItemList() {\n  const [items, setItems] = useState([])\n  const [error, setError] = useState(null)\n\n  useEffect(() => {\n    let cancelled = false\n\n    ;(async () => {\n      try {\n        const res = await fetch('\u002Fapi\u002Fitems')\n        const text = await res.text()\n\n        if (cancelled) return\n\n        if (text.trim() === '') {\n          setItems([])          \u002F\u002F no content is a valid outcome, not an error\n          return\n        }\n\n        setItems(JSON.parse(text))\n      } catch (err) {\n        if (!cancelled) setError(err)\n      }\n    })()\n\n    return () => { cancelled = true }\n  }, [])\n\n  if (error) return \u003Cp>Failed to load: {error.message}\u003C\u002Fp>\n  return \u003Cul>{items.map((i) => \u003Cli key={i.id}>{i.name}\u003C\u002Fli>)}\u003C\u002Ful>\n}\n","jsx",[25,625,622],{"__ignoreMap":23},[28,627,628,629,638,639,642],{},"Two habits prevent most of these: ",[32,630,631,632,635,636],{},"never call ",[25,633,634],{},"JSON.parse"," on a value that might be ",[25,637,313],{},", and ",[32,640,641],{},"never parse during render"," — parse inside the effect or the loader, after you have confirmed the text exists.",[28,644,645,646,649,650,653,654,656,657,659,660,662],{},"If the JSON comes from ",[25,647,648],{},"localStorage",", the same rule applies: ",[25,651,652],{},"localStorage.getItem(key)"," returns ",[25,655,337],{}," when the key is missing, and ",[25,658,329],{}," quietly returns ",[25,661,337],{}," instead of the object you expected.",[71,664,666],{"id":665},"validate-and-repair-the-json-in-your-browser","Validate and repair the JSON in your browser",[28,668,669],{},"When you have the text in front of you, two tools finish the job:",[28,671,672,676,677,680,681,223,684,687],{},[32,673,674],{},[57,675,60],{"href":59}," — fixes trailing commas, single quotes, unquoted keys, ",[32,678,679],{},"missing closing brackets",", comments, and Python\u002FJS constants such as ",[25,682,683],{},"True",[25,685,686],{},"NaN",". It applies best-effort fixes, then parses the result to confirm it is valid before showing it.",[28,689,690],{},"Two limits to keep in mind, both stated on the tool page:",[135,692,693,700],{},[138,694,695,696,699],{},"It ",[32,697,698],{},"cannot invent missing data",". Closing a bracket is recoverable; a document whose middle was cut off is not.",[138,701,702,703,706],{},"If the structure cannot be recovered, it ",[32,704,705],{},"reports an error instead of returning partial output",". That is the correct outcome for a truncated response — get the full data instead.",[28,708,709,715],{},[32,710,711],{},[57,712,714],{"href":713},"\u002Ftools\u002Fformat\u002Fjson-editor","JSON Editor"," — paste or open the file to get live syntax validation with the error position, then format or minify. Use it to confirm a hand-written file is complete before your application reads it.",[28,717,718],{},"Both run in your browser, so the payload is not uploaded — which matters when the broken JSON is a production API response.",[71,720,722],{"id":721},"how-to-prevent-the-error","How to prevent the error",[28,724,725],{},[32,726,727],{},"Server side:",[135,729,730,740,750,756],{},[138,731,732,735,736,739],{},[32,733,734],{},"Always return valid JSON, including errors."," ",[25,737,738],{},"{\"error\": {...}}"," is far easier to debug than an empty 500.",[138,741,742,749],{},[32,743,744,745,748],{},"Do not set ",[25,746,747],{},"Content-Type: application\u002Fjson"," on a 204."," If there is no body, say so with the status code and no content type.",[138,751,752,755],{},[32,753,754],{},"Set explicit timeouts and body-size limits"," so a truncation fails loudly with a status code instead of silently cutting a document in half.",[138,757,758,761],{},[32,759,760],{},"Write files atomically"," (temp file + rename) so no reader ever sees a partial file.",[28,763,764],{},[32,765,766],{},"Client side:",[135,768,769,777,786,792],{},[138,770,771,735,774,69],{},[32,772,773],{},"Guard before parsing:",[25,775,776],{},"if (text && text.trim() !== '') { JSON.parse(text) }",[138,778,779,785],{},[32,780,781,782,784],{},"Wrap ",[25,783,84],{}," in try\u002Fcatch"," and include the length and the tail of the string in the error message — that is the information you will need later.",[138,787,788,791],{},[32,789,790],{},"Treat \"no content\" as a normal outcome"," for endpoints that can legitimately return nothing.",[138,793,794,797],{},[32,795,796],{},"Log the offending payload safely:"," log length, status, and a truncated tail, not the whole body, which may contain tokens or personal data.",[71,799,801],{"id":800},"faq","FAQ",[105,803,74],{"id":804},"what-does-unexpected-end-of-json-input-mean-1",[28,806,807,809],{},[25,808,84],{}," reached the end of the string while still expecting more content. On current engines that most often means the input was empty or whitespace-only, or ended right after a comma, colon, or mid-literal.",[105,811,813],{"id":812},"is-this-error-always-caused-by-an-empty-response","Is this error always caused by an empty response?",[28,815,816],{},"No, but on modern V8 an empty or whitespace-only string is the most common cause of this exact wording. A document with a missing closing bracket usually produces a different message that includes a character position — unless you are on an older engine, which reported the same message for both.",[105,818,820],{"id":819},"how-do-i-know-if-the-response-is-truncated","How do I know if the response is truncated?",[28,822,823,824,826],{},"Compare the bytes you received with the ",[25,825,251],{}," header, and look at the last ~80 characters. If the document stops mid-value, or you received fewer bytes than declared, it was truncated — re-fetch rather than trying to parse it.",[105,828,830],{"id":829},"can-this-error-happen-with-otherwise-valid-json","Can this error happen with otherwise valid JSON?",[28,832,833],{},"Yes — if only part of a valid document arrived. A 400 KB response cut off at 300 KB is \"valid JSON\" that was never fully delivered. The other case is a file you read while it was still being written.",[105,835,837],{"id":836},"how-do-i-fix-it-in-fetch","How do I fix it in fetch?",[28,839,840,841,843,844,846,847,265,850,853,854,856],{},"Do not call ",[25,842,366],{}," directly. Read ",[25,845,538],{},", return early for ",[25,848,849],{},"204",[25,851,852],{},"205",", or an empty body, verify the content type, then ",[25,855,84],{}," inside a try\u002Fcatch that reports the length and tail of the text.",[105,858,860],{"id":859},"how-do-i-fix-it-in-react","How do I fix it in React?",[28,862,863,864,867],{},"Parse inside the effect or loader, not during render, and only after confirming the text exists. Handle the empty-body case explicitly instead of letting ",[25,865,866],{},"JSON.parse('')"," throw on every render.",[105,869,871],{"id":870},"how-do-i-fix-it-in-nodejs","How do I fix it in Node.js?",[28,873,874,875,878,879,881],{},"Check for an empty string after ",[25,876,877],{},"fs.readFile",", and write files atomically (temp file + ",[25,880,609],{},") so a concurrent read never sees half a file.",[105,883,885],{"id":884},"can-an-online-tool-repair-truncated-json","Can an online tool repair truncated JSON?",[28,887,888],{},"It can repair documents with recoverable syntax problems — missing closing brackets, trailing commas, quoting issues. It cannot restore data that never arrived. For a truncated response, re-fetch from the source.",[105,890,892,893,895],{"id":891},"why-does-jsonparsenull-not-throw","Why does ",[25,894,329],{}," not throw?",[28,897,898,899,338,901,903,904,906,907,909,910,912],{},"Because ",[25,900,337],{},[25,902,341],{},", which is valid JSON. It returns ",[25,905,337],{},". This silently masks missing values, so check for ",[25,908,337],{}," before parsing values from ",[25,911,648],{}," or optional fields.",[71,914,916],{"id":915},"whats-next","What's Next?",[135,918,919,927,935,943],{},[138,920,921,924,925,69],{},[32,922,923],{},"Have the broken text?"," Paste it into ",[57,926,60],{"href":59},[138,928,929,932,933,69],{},[32,930,931],{},"Need the error position?"," Validate it in the ",[57,934,714],{"href":713},[138,936,937,940,941,69],{},[32,938,939],{},"Other parse errors?"," Read ",[57,942,68],{"href":67},[138,944,945,948,949,953,954,69],{},[32,946,947],{},"Suspect the file itself?"," See ",[57,950,952],{"href":951},"\u002Fblog\u002Fhow-to-open-json-file","How to Open, View, and Edit a JSON File"," and ",[57,955,957],{"href":956},"\u002Fblog\u002Fhow-to-create-json-file","How to Create a JSON File",{"title":23,"searchDepth":959,"depth":959,"links":960},2,[961,965,966,973,974,975,976,977,978,990],{"id":73,"depth":959,"text":74,"children":962},[963],{"id":107,"depth":964,"text":108},3,{"id":159,"depth":959,"text":160},{"id":352,"depth":959,"text":353,"children":967},[968,969,970,971,972],{"id":359,"depth":964,"text":360},{"id":376,"depth":964,"text":377},{"id":396,"depth":964,"text":397},{"id":482,"depth":964,"text":483},{"id":495,"depth":964,"text":496},{"id":511,"depth":959,"text":512},{"id":574,"depth":959,"text":575},{"id":613,"depth":959,"text":614},{"id":665,"depth":959,"text":666},{"id":721,"depth":959,"text":722},{"id":800,"depth":959,"text":801,"children":979},[980,981,982,983,984,985,986,987,988],{"id":804,"depth":964,"text":74},{"id":812,"depth":964,"text":813},{"id":819,"depth":964,"text":820},{"id":829,"depth":964,"text":830},{"id":836,"depth":964,"text":837},{"id":859,"depth":964,"text":860},{"id":870,"depth":964,"text":871},{"id":884,"depth":964,"text":885},{"id":891,"depth":964,"text":989},"Why does JSON.parse(null) not throw?",{"id":915,"depth":959,"text":916},"json_tools","2026-10-04T00:00:00.000Z","Unexpected end of JSON input: the parser ran out of text too early. Diagnose empty, truncated, or unclosed JSON, then fix it in fetch, Node, and files.",false,"md","\u002Fblog\u002Fcover\u002Fen\u002Funexpected-end-of-json-input-cover.svg",[998],"en",{},true,"\u002Fen\u002Fblog\u002Funexpected-end-of-json-input",{"slug":1003,"text":1004,"btn":1005},"json-repair","Paste the broken JSON and repair it in your browser:","Open JSON Repair",{"title":6,"description":993},"en\u002Fblog\u002Funexpected-end-of-json-input",[1009,634,1010,1011,1012],"JSON","Debugging","JavaScript","API","AecV3R5yHNO1d9xSwwnz4gsfg4nZiUl8CveDlDsd3LM",{"id":1015,"title":1016,"author":7,"body":1017,"category":991,"date":2213,"description":2214,"draft":994,"extension":995,"h1":1022,"image":2215,"lastmod":2213,"locales":2216,"meta":2217,"navigation":1000,"path":2218,"promo":2219,"seo":2223,"stem":2224,"tags":2225,"__hash__":2228},"blog\u002Fen\u002Fblog\u002Fhow-to-create-manifest-json.md","How to Create a manifest.json File: PWA & Chrome Examples",{"type":9,"value":1018,"toc":2179},[1019,1023,1030,1039,1045,1049,1055,1058,1119,1122,1136,1139,1143,1152,1155,1215,1230,1236,1240,1244,1265,1269,1325,1329,1345,1349,1357,1363,1367,1370,1378,1385,1389,1396,1403,1416,1420,1556,1563,1567,1573,1600,1603,1634,1638,1642,1648,1652,1701,1705,1725,1728,1734,1748,1752,1776,1779,1783,1911,1915,1918,1927,1936,1946,1954,1957,1970,1974,1977,2022,2025,2027,2031,2044,2048,2051,2055,2071,2075,2083,2087,2096,2100,2116,2120,2130,2132,2171,2174],[12,1020,1022],{"id":1021},"how-to-create-a-manifestjson-file-pwa-and-chrome-extension-examples","How to Create a manifest.json File: PWA and Chrome Extension Examples",[28,1024,1025,1026,1029],{},"Two developers can search \"how to create a manifest.json file\" and need completely different files. One is adding install support to a website. The other is publishing a Chrome extension. Both files are named ",[25,1027,1028],{},"manifest.json",". Almost nothing else about them is the same.",[28,1031,1032,1033,1038],{},"That is the key idea: ",[32,1034,1035,1037],{},[25,1036,1028],{}," is a filename convention, not a format."," The file is ordinary JSON; what matters is the specification the consumer expects. This guide covers the two specs you are most likely to need — the W3C Web App Manifest (PWA) and the Chrome Extension Manifest V3 — with minimal working examples, the fields each one requires, and how to debug them when a browser refuses to load them.",[28,1040,1041,1042,1044],{},"If you are new to JSON files themselves, start with ",[57,1043,957],{"href":956}," for the syntax rules and saving steps, then come back here.",[71,1046,1048],{"id":1047},"what-is-a-manifestjson-file","What is a manifest.json file?",[28,1050,1051,1052,1054],{},"A ",[25,1053,1028],{}," is a JSON file that describes an application to the software that runs it: its name, icons, entry point, permissions, and display behavior.",[28,1056,1057],{},"The same filename is used by several unrelated ecosystems:",[162,1059,1060,1073],{},[165,1061,1062],{},[168,1063,1064,1067,1070],{},[171,1065,1066],{},"Kind of manifest",[171,1068,1069],{},"Who reads it",[171,1071,1072],{},"Purpose",[181,1074,1075,1086,1097,1108],{},[168,1076,1077,1080,1083],{},[186,1078,1079],{},"Web App Manifest",[186,1081,1082],{},"Browsers",[186,1084,1085],{},"Makes a site installable as a PWA",[168,1087,1088,1091,1094],{},[186,1089,1090],{},"Extension manifest",[186,1092,1093],{},"Chrome, Edge, Firefox",[186,1095,1096],{},"Declares an extension's metadata, scripts, and permissions",[168,1098,1099,1102,1105],{},[186,1100,1101],{},"Framework manifest",[186,1103,1104],{},"Next.js and similar tools",[186,1106,1107],{},"Generated or consumed by the framework",[168,1109,1110,1113,1116],{},[186,1111,1112],{},"Platform manifest",[186,1114,1115],{},"Game mods, plugins, cloud services",[186,1117,1118],{},"Platform-specific packaging metadata",[28,1120,1121],{},"Two rules hold across all of them:",[530,1123,1124,1130],{},[138,1125,1126,1129],{},[32,1127,1128],{},"The file is JSON."," No comments, no trailing commas, double-quoted keys, UTF-8. A file that is valid JSON can still be rejected, but a file that is not valid JSON is always rejected.",[138,1131,1132,1135],{},[32,1133,1134],{},"The spec decides the fields."," Copying a Chrome extension's manifest into a PWA does nothing useful — the structures are not interchangeable.",[28,1137,1138],{},"Because these files are edited by hand and read by strict parsers, the same three problems come up constantly: a trailing comma, a comment someone added for documentation, and an icon path that 404s.",[71,1140,1142],{"id":1141},"web-app-manifest-pwa-what-it-is-and-when-you-need-it","Web App Manifest (PWA): what it is and when you need it",[28,1144,1145,1146,1151],{},"The ",[57,1147,1150],{"href":1148,"rel":1149},"https:\u002F\u002Fwww.w3.org\u002FTR\u002Fappmanifest\u002F",[81],"Web Application Manifest"," is a W3C specification: a JSON file that tells the browser how your app should look and behave when installed.",[28,1153,1154],{},"It declares:",[135,1156,1157,1168,1174,1183,1204],{},[138,1158,1159,735,1162,953,1165,69],{},[32,1160,1161],{},"Identity:",[25,1163,1164],{},"name",[25,1166,1167],{},"short_name",[138,1169,1170,1173],{},[32,1171,1172],{},"Icons:"," sizes the browser uses for the home screen, taskbar, and splash screen.",[138,1175,1176,735,1179,1182],{},[32,1177,1178],{},"Entry point:",[25,1180,1181],{},"start_url"," — what opens when the app is launched.",[138,1184,1185,735,1188,1191,1192,265,1195,265,1198,287,1201,69],{},[32,1186,1187],{},"Display:",[25,1189,1190],{},"display"," — ",[25,1193,1194],{},"standalone",[25,1196,1197],{},"fullscreen",[25,1199,1200],{},"minimal-ui",[25,1202,1203],{},"browser",[138,1205,1206,735,1209,953,1212,69],{},[32,1207,1208],{},"Colors:",[25,1210,1211],{},"theme_color",[25,1213,1214],{},"background_color",[28,1216,1217,1218,1223,1224,1229],{},"You need one if you want your site to be installable — added to a phone's home screen or a desktop dock and opened in its own window instead of a browser tab. MDN's ",[57,1219,1222],{"href":1220,"rel":1221},"https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FManifest",[81],"Web app manifests"," guide and web.dev's ",[57,1225,1228],{"href":1226,"rel":1227},"https:\u002F\u002Fweb.dev\u002Flearn\u002Fpwa\u002Fweb-app-manifest",[81],"web app manifest"," tutorial are the reference material.",[28,1231,1232,1233,1235],{},"You do ",[32,1234,333],{}," need one for a site that should stay a website.",[71,1237,1239],{"id":1238},"how-to-create-a-manifestjson-for-a-pwa","How to create a manifest.json for a PWA",[105,1241,1243],{"id":1242},"step-1-create-the-file","Step 1: Create the file",[28,1245,1246,1247,1249,1250,1253,1254,1257,1258,1261,1262,69],{},"Create ",[25,1248,1028],{}," in your site's public root (or ",[25,1251,1252],{},"manifest.webmanifest"," — see the FAQ). For a project that serves ",[25,1255,1256],{},"public\u002F"," statically, that is ",[25,1259,1260],{},"public\u002Fmanifest.json",", which becomes ",[25,1263,1264],{},"\u002Fmanifest.json",[105,1266,1268],{"id":1267},"step-2-add-the-required-fields","Step 2: Add the required fields",[162,1270,1271,1281],{},[165,1272,1273],{},[168,1274,1275,1278],{},[171,1276,1277],{},"Field",[171,1279,1280],{},"Why it is needed",[181,1282,1283,1294,1304,1313],{},[168,1284,1285,1291],{},[186,1286,1287,223,1289],{},[25,1288,1164],{},[25,1290,1167],{},[186,1292,1293],{},"The label shown under the icon and in the install dialog",[168,1295,1296,1301],{},[186,1297,1298],{},[25,1299,1300],{},"icons",[186,1302,1303],{},"At minimum a 192px and a 512px PNG",[168,1305,1306,1310],{},[186,1307,1308],{},[25,1309,1181],{},[186,1311,1312],{},"The page that opens when the app launches",[168,1314,1315,1319],{},[186,1316,1317],{},[25,1318,1190],{},[186,1320,1321,1322,1324],{},"Whether the app gets its own window; ",[25,1323,1194],{}," is the common choice",[105,1326,1328],{"id":1327},"step-3-add-the-recommended-fields","Step 3: Add the recommended fields",[28,1330,1331,265,1334,265,1336,265,1338,638,1341,1344],{},[25,1332,1333],{},"description",[25,1335,1211],{},[25,1337,1214],{},[25,1339,1340],{},"orientation",[25,1342,1343],{},"screenshots"," improve the install experience and are quick to add.",[105,1346,1348],{"id":1347},"step-4-write-the-manifest","Step 4: Write the manifest",[17,1350,1355],{"className":1351,"code":1353,"language":1354,"meta":23},[1352],"language-json","{\n  \"name\": \"JSON Toolbox\",\n  \"short_name\": \"JSON Toolbox\",\n  \"description\": \"Free, browser-based JSON tools for developers.\",\n  \"start_url\": \"\u002F\",\n  \"scope\": \"\u002F\",\n  \"display\": \"standalone\",\n  \"background_color\": \"#ffffff\",\n  \"theme_color\": \"#0284c7\",\n  \"orientation\": \"portrait-primary\",\n  \"icons\": [\n    {\n      \"src\": \"\u002Ficons\u002Ficon-192.png\",\n      \"sizes\": \"192x192\",\n      \"type\": \"image\u002Fpng\",\n      \"purpose\": \"any\"\n    },\n    {\n      \"src\": \"\u002Ficons\u002Ficon-512.png\",\n      \"sizes\": \"512x512\",\n      \"type\": \"image\u002Fpng\",\n      \"purpose\": \"any\"\n    },\n    {\n      \"src\": \"\u002Ficons\u002Fmaskable-512.png\",\n      \"sizes\": \"512x512\",\n      \"type\": \"image\u002Fpng\",\n      \"purpose\": \"maskable\"\n    }\n  ]\n}\n","json",[25,1356,1353],{"__ignoreMap":23},[28,1358,1359,1362],{},[25,1360,1361],{},"purpose: \"maskable\""," is optional but worth having: it tells Android the icon has safe padding, so the OS can crop it into a shape without cutting off your logo.",[105,1364,1366],{"id":1365},"step-5-link-it-from-your-html","Step 5: Link it from your HTML",[28,1368,1369],{},"The manifest does nothing until a page points at it:",[17,1371,1376],{"className":1372,"code":1374,"language":1375,"meta":23},[1373],"language-html","\u003Clink rel=\"manifest\" href=\"\u002Fmanifest.json\">\n","html",[25,1377,1374],{"__ignoreMap":23},[28,1379,1380,1381,1384],{},"Put it in the ",[25,1382,1383],{},"\u003Chead>"," of every page you want installable — or at least your entry page.",[105,1386,1388],{"id":1387},"step-6-serve-it-over-https-and-test","Step 6: Serve it over HTTPS and test",[28,1390,1391,1392,1395],{},"Browsers only offer installation in a secure context, so the manifest and the site must be served over HTTPS in production (",[25,1393,1394],{},"localhost"," counts as secure for development).",[28,1397,1398,1399,1402],{},"To verify, open DevTools → ",[32,1400,1401],{},"Application → Manifest",". Chrome shows the parsed fields, flags missing icons, and reports whether the page meets its installability criteria. That panel is far faster than guessing: it names the exact field that is missing.",[28,1404,1405,1406,223,1408,1410,1411,265,1413,1415],{},"Chrome's criteria include an HTTPS origin, a manifest with ",[25,1407,1164],{},[25,1409,1167],{},", 192px and 512px icons, ",[25,1412,1181],{},[25,1414,1190],{},", and a registered service worker with a fetch handler. The set has changed across Chrome versions, so treat the DevTools panel as the source of truth rather than any single article — including this one.",[71,1417,1419],{"id":1418},"common-mistakes-when-creating-a-pwa-manifest","Common mistakes when creating a PWA manifest",[162,1421,1422,1435],{},[165,1423,1424],{},[168,1425,1426,1429,1432],{},[171,1427,1428],{},"Symptom",[171,1430,1431],{},"Likely cause",[171,1433,1434],{},"Fix",[181,1436,1437,1451,1469,1487,1503,1518,1534],{},[168,1438,1439,1442,1445],{},[186,1440,1441],{},"\"Manifest: Line: 1, column: 1, Syntax error\"",[186,1443,1444],{},"Invalid JSON — usually a trailing comma or a comment",[186,1446,1447,1448,1450],{},"Remove it, or paste the file into ",[57,1449,60],{"href":59}," to clean it up",[168,1452,1453,1456,1463],{},[186,1454,1455],{},"DevTools shows no manifest at all",[186,1457,1458,1459,1462],{},"Missing or wrong ",[25,1460,1461],{},"\u003Clink rel=\"manifest\">"," path",[186,1464,1465,1466],{},"Use an absolute path: ",[25,1467,1468],{},"href=\"\u002Fmanifest.json\"",[168,1470,1471,1474,1481],{},[186,1472,1473],{},"Manifest fetched but not parsed",[186,1475,1476,1477,1480],{},"Server returned ",[25,1478,1479],{},"text\u002Fhtml"," — usually a 404 page or a SPA fallback",[186,1482,1483,1484,1486],{},"Make sure ",[25,1485,1264],{}," is served as JSON, not your index.html",[168,1488,1489,1492,1500],{},[186,1490,1491],{},"Install prompt never appears",[186,1493,1494,1495,200,1497,1499],{},"Missing 192px or 512px icon, missing ",[25,1496,1181],{},[25,1498,1190],{},", not HTTPS, or no service worker with a fetch handler",[186,1501,1502],{},"Check the Installability section in DevTools",[168,1504,1505,1508,1515],{},[186,1506,1507],{},"Icon looks broken or cropped",[186,1509,1510,1511,1514],{},"Wrong icon path, or no ",[25,1512,1513],{},"maskable"," icon",[186,1516,1517],{},"Use absolute paths; add a maskable icon with padding",[168,1519,1520,1523,1528],{},[186,1521,1522],{},"App opens the wrong page",[186,1524,1525,1527],{},[25,1526,1181],{}," relative to the manifest, not the HTML",[186,1529,1530,1531,1533],{},"Start it with ",[25,1532,200],{}," and confirm it resolves",[168,1535,1536,1539,1549],{},[186,1537,1538],{},"Field ignored by the browser",[186,1540,1541,1542,1545,1546,1548],{},"Typo or wrong type (",[25,1543,1544],{},"\"display\": \"Standalone\""," is not valid; use lowercase ",[25,1547,1194],{},")",[186,1550,1551,1552],{},"Compare against the ",[57,1553,1555],{"href":1148,"rel":1554},[81],"W3C spec",[28,1557,1558,1559,69],{},"One trap worth calling out: your editor may accept comments in this file because VS Code reads many config files as JSONC. The browser does not. Comments make the manifest fail to parse — see ",[57,1560,1562],{"href":1561},"\u002Fblog\u002Fjson-comments","Comments in JSON",[71,1564,1566],{"id":1565},"chrome-extension-manifestjson-what-it-is-and-when-you-need-it","Chrome extension manifest.json: what it is and when you need it",[28,1568,1569,1570,1572],{},"Every Chrome extension has a ",[25,1571,1028],{}," in its root directory. It declares the extension's name, version, icons, scripts, and permissions — without it, Chrome will not load the folder at all.",[28,1574,1575,1576,1579,1580,1583,1584,1587,1588,1592,1593,69],{},"The current standard is ",[32,1577,1578],{},"Manifest V3",". V2 extensions have been phased out, so any example showing ",[25,1581,1582],{},"\"manifest_version\": 2"," or a ",[25,1585,1586],{},"background.scripts"," array is out of date. See Chrome's ",[57,1589,1578],{"href":1590,"rel":1591},"https:\u002F\u002Fdeveloper.chrome.com\u002Fdocs\u002Fextensions\u002Fdevelop\u002Fmigrate\u002Fwhat-is-mv3",[81]," overview and MDN's ",[57,1594,1597,1599],{"href":1595,"rel":1596},"https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FMozilla\u002FAdd-ons\u002FWebExtensions\u002Fmanifest.json",[81],[25,1598,1028],{}," reference",[28,1601,1602],{},"Three V3 changes cause most migration errors:",[530,1604,1605,1618,1631],{},[138,1606,1607,1608,1611,1612,542,1615,69],{},"Background pages are ",[32,1609,1610],{},"service workers",": ",[25,1613,1614],{},"\"background\": { \"service_worker\": \"background.js\" }",[25,1616,1617],{},"\"background\": { \"scripts\": [...] }",[138,1619,1620,1621,1626,1627,1630],{},"Host access moved to ",[32,1622,1623],{},[25,1624,1625],{},"host_permissions","; ",[25,1628,1629],{},"permissions"," now holds API permissions only.",[138,1632,1633],{},"Remotely hosted code is not allowed — scripts must ship inside the extension.",[71,1635,1637],{"id":1636},"how-to-create-a-manifestjson-for-a-chrome-extension-manifest-v3","How to create a manifest.json for a Chrome extension (Manifest V3)",[105,1639,1641],{"id":1640},"step-1-create-the-file-in-the-extension-root","Step 1: Create the file in the extension root",[17,1643,1646],{"className":1644,"code":1645,"language":22,"meta":23},[20],"my-extension\u002F\n├── manifest.json\n├── background.js\n├── popup.html\n└── icons\u002F\n    ├── icon-16.png\n    ├── icon-48.png\n    └── icon-128.png\n",[25,1647,1645],{"__ignoreMap":23},[105,1649,1651],{"id":1650},"step-2-add-the-required-keys","Step 2: Add the required keys",[162,1653,1654,1664],{},[165,1655,1656],{},[168,1657,1658,1661],{},[171,1659,1660],{},"Key",[171,1662,1663],{},"Requirement",[181,1665,1666,1679,1688],{},[168,1667,1668,1673],{},[186,1669,1670],{},[25,1671,1672],{},"manifest_version",[186,1674,1675,1676],{},"Must be ",[25,1677,1678],{},"3",[168,1680,1681,1685],{},[186,1682,1683],{},[25,1684,1164],{},[186,1686,1687],{},"Display name",[168,1689,1690,1695],{},[186,1691,1692],{},[25,1693,1694],{},"version",[186,1696,1697,1698],{},"One to four dot-separated integers, e.g. ",[25,1699,1700],{},"\"1.0.0\"",[105,1702,1704],{"id":1703},"step-3-add-the-keys-most-extensions-need","Step 3: Add the keys most extensions need",[28,1706,1707,265,1709,265,1711,1714,1715,265,1718,265,1720,638,1722,69],{},[25,1708,1333],{},[25,1710,1300],{},[25,1712,1713],{},"action"," (toolbar button and popup), ",[25,1716,1717],{},"background.service_worker",[25,1719,1629],{},[25,1721,1625],{},[25,1723,1724],{},"content_scripts",[105,1726,1348],{"id":1727},"step-4-write-the-manifest-1",[17,1729,1732],{"className":1730,"code":1731,"language":1354,"meta":23},[1352],"{\n  \"manifest_version\": 3,\n  \"name\": \"My Extension\",\n  \"version\": \"1.0.0\",\n  \"description\": \"A minimal Manifest V3 Chrome extension.\",\n  \"icons\": {\n    \"16\": \"icons\u002Ficon-16.png\",\n    \"48\": \"icons\u002Ficon-48.png\",\n    \"128\": \"icons\u002Ficon-128.png\"\n  },\n  \"action\": {\n    \"default_popup\": \"popup.html\",\n    \"default_title\": \"My Extension\",\n    \"default_icon\": {\n      \"16\": \"icons\u002Ficon-16.png\",\n      \"48\": \"icons\u002Ficon-48.png\",\n      \"128\": \"icons\u002Ficon-128.png\"\n    }\n  },\n  \"background\": {\n    \"service_worker\": \"background.js\"\n  },\n  \"permissions\": [\"storage\"],\n  \"host_permissions\": [\"https:\u002F\u002Fexample.com\u002F*\"]\n}\n",[25,1733,1731],{"__ignoreMap":23},[28,1735,1736,1737,1740,1741,542,1744,1747],{},"Note the icon keys: they are ",[32,1738,1739],{},"strings"," (",[25,1742,1743],{},"\"16\"",[25,1745,1746],{},"16","), and the paths are relative to the extension root, not the manifest.",[105,1749,1751],{"id":1750},"step-5-load-and-test-it","Step 5: Load and test it",[530,1753,1754,1760,1766,1773],{},[138,1755,1756,1757,69],{},"Open ",[25,1758,1759],{},"chrome:\u002F\u002Fextensions",[138,1761,1762,1763,69],{},"Enable ",[32,1764,1765],{},"Developer mode",[138,1767,1768,1769,1772],{},"Click ",[32,1770,1771],{},"Load unpacked"," and select your extension folder.",[138,1774,1775],{},"Read the error list on the extension's card — Chrome reports manifest problems with the key involved, and the service worker's console is reachable via the \"service worker\" link.",[28,1777,1778],{},"A manifest that is valid JSON can still be rejected here. Chrome validates the schema too: an unknown key produces a warning, and an invalid value produces an error.",[71,1780,1782],{"id":1781},"common-mistakes-when-creating-a-chrome-extension-manifest","Common mistakes when creating a Chrome extension manifest",[162,1784,1785,1796],{},[165,1786,1787],{},[168,1788,1789,1792,1794],{},[171,1790,1791],{},"Mistake",[171,1793,1428],{},[171,1795,1434],{},[181,1797,1798,1814,1831,1846,1861,1875,1886,1901],{},[168,1799,1800,1805,1808],{},[186,1801,1802,1804],{},[25,1803,1582],{}," or missing",[186,1806,1807],{},"\"Unrecognized manifest key\" \u002F refuses to load",[186,1809,1810,1811],{},"Set ",[25,1812,1813],{},"\"manifest_version\": 3",[168,1815,1816,1822,1825],{},[186,1817,262,1818,223,1820],{},[25,1819,1164],{},[25,1821,1694],{},[186,1823,1824],{},"\"Required value 'version' is missing\"",[186,1826,1827,1828,1830],{},"Add both; ",[25,1829,1694],{}," must be dot-separated integers",[168,1832,1833,1837,1840],{},[186,1834,1835],{},[25,1836,1617],{},[186,1838,1839],{},"Background never runs in V3",[186,1841,1842,1843],{},"Use ",[25,1844,1845],{},"\"service_worker\": \"background.js\"",[168,1847,1848,1853,1856],{},[186,1849,1850,1851],{},"Match patterns in ",[25,1852,1629],{},[186,1854,1855],{},"\"Permission ... is unknown or URL pattern is malformed\"",[186,1857,1858,1859],{},"Move URLs to ",[25,1860,1625],{},[168,1862,1863,1866,1869],{},[186,1864,1865],{},"Icon key is a number",[186,1867,1868],{},"Icon missing",[186,1870,1871,1872],{},"Use string keys: ",[25,1873,1874],{},"\"16\": \"icons\u002Ficon-16.png\"",[168,1876,1877,1880,1883],{},[186,1878,1879],{},"Icon file missing",[186,1881,1882],{},"\"Could not load icon\"",[186,1884,1885],{},"Verify the path relative to the extension root",[168,1887,1888,1891,1894],{},[186,1889,1890],{},"Comments in the manifest",[186,1892,1893],{},"\"Manifest is not valid JSON\"",[186,1895,1896,1897],{},"Remove them — or strip them with ",[57,1898,1900],{"href":1899},"\u002Ftools\u002Fconvert\u002Fjsonc-to-json","JSONC to JSON",[168,1902,1903,1906,1908],{},[186,1904,1905],{},"Trailing comma",[186,1907,1893],{},[186,1909,1910],{},"Remove the final comma",[71,1912,1914],{"id":1913},"write-validate-and-format-your-manifest","Write, validate, and format your manifest",[28,1916,1917],{},"Manifest files are small, hand-edited, and unforgiving. Three checks catch nearly every failure:",[28,1919,1920,1923,1924,1926],{},[32,1921,1922],{},"1. Validate the JSON first."," Paste the file into the ",[57,1925,714],{"href":713},": it highlights syntax errors as you type and can format or minify the document before you copy or download it. Because it runs in your browser, you can paste an unreleased extension manifest or an internal PWA config without sending it anywhere.",[28,1928,1929,1932,1933,1935],{},[32,1930,1931],{},"2. Repair instead of rewriting."," If the file already has trailing commas, single quotes, unquoted keys, or comments, ",[57,1934,60],{"href":59}," fixes all of them at once and returns valid JSON.",[28,1937,1938,1941,1942,1945],{},[32,1939,1940],{},"3. Check it from the command line."," On any machine with ",[25,1943,1944],{},"jq"," or Python installed:",[17,1947,1952],{"className":1948,"code":1950,"language":1951,"meta":23},[1949],"language-bash","jq . manifest.json\npython -m json.tool manifest.json\n","bash",[25,1953,1950],{"__ignoreMap":23},[28,1955,1956],{},"Both parse the file and print it, so an error means the JSON is invalid. Commands like these are also easy to add to CI so a broken manifest never reaches production.",[28,1958,1959,1960,1964,1965,1969],{},"For an extra layer, generate a JSON Schema from a known-good manifest with the ",[57,1961,1963],{"href":1962},"\u002Ftools\u002Fconvert\u002Fjson-schema-generator","JSON Schema Generator"," and validate future versions against it with the ",[57,1966,1968],{"href":1967},"\u002Ftools\u002Fformat\u002Fjson-schema-validator","JSON Schema Validator",". This catches a renamed or missing key that is still perfectly valid JSON — the class of bug syntax checking cannot see.",[71,1971,1973],{"id":1972},"other-types-of-manifestjson","Other types of manifest.json",[28,1975,1976],{},"The same filename appears in other ecosystems, each with its own required fields:",[135,1978,1979,1997,2006,2014],{},[138,1980,1981,1984,1985,223,1988,1991,1992,69],{},[32,1982,1983],{},"Next.js"," — the App Router supports ",[25,1986,1987],{},"app\u002Fmanifest.json",[25,1989,1990],{},"app\u002Fmanifest.ts"," and generates the Web App Manifest for you; see the ",[57,1993,1996],{"href":1994,"rel":1995},"https:\u002F\u002Fnextjs.org\u002Fdocs\u002Fapp\u002Fapi-reference\u002Ffile-conventions\u002Fmetadata\u002Fmanifest",[81],"Next.js manifest documentation",[138,1998,1999,2002,2003,2005],{},[32,2000,2001],{},"Adobe UXP plugins"," — a ",[25,2004,1028],{}," declaring the plugin id, host application, and entry point.",[138,2007,2008,2002,2011,2013],{},[32,2009,2010],{},"Minecraft behavior and resource packs",[25,2012,1028],{}," with a header, module list, and UUIDs.",[138,2015,2016,2019,2020,69],{},[32,2017,2018],{},"Cloud and container tooling"," — various deployment descriptors also named ",[25,2021,1028],{},[28,2023,2024],{},"The pattern is always the same: the platform's documentation defines the fields, and JSON syntax is only the container. When in doubt, follow the platform's official docs over any generic tutorial — including this one.",[71,2026,801],{"id":800},[105,2028,2030],{"id":2029},"what-is-the-difference-between-manifestjson-and-manifestwebmanifest","What is the difference between manifest.json and manifest.webmanifest?",[28,2032,2033,2034,2037,2038,345,2041,2043],{},"They hold the same content. ",[25,2035,2036],{},".webmanifest"," is the extension recommended by the W3C spec, and the spec's media type is ",[25,2039,2040],{},"application\u002Fmanifest+json",[25,2042,1028],{}," is the de facto name most projects use, and browsers accept it. Pick one; make sure your server sends a JSON content type for it.",[105,2045,2047],{"id":2046},"do-i-need-a-manifestjson-for-every-website","Do I need a manifest.json for every website?",[28,2049,2050],{},"No. Add one if you want the site to be installable or to control how it looks when installed. A blog, a docs site, or a marketing page that should stay in a browser tab needs nothing.",[105,2052,2054],{"id":2053},"can-i-use-comments-in-a-manifestjson","Can I use comments in a manifest.json?",[28,2056,2057,2058,953,2061,2064,2065,2067,2068,2070],{},"Not in the file you ship. Standard JSON has no comment syntax, so ",[25,2059,2060],{},"\u002F\u002F",[25,2062,2063],{},"\u002F* *\u002F"," make the manifest invalid and both browsers and Chrome will reject it. Your editor may accept them because it reads the file as JSONC — that is the editor being lenient, not the browser. See ",[57,2066,1562],{"href":1561},", and use ",[57,2069,1900],{"href":1899}," to strip them before publishing.",[105,2072,2074],{"id":2073},"why-doesnt-my-pwa-show-the-install-prompt","Why doesn't my PWA show the install prompt?",[28,2076,2077,2078,223,2080,2082],{},"Usually one of: the manifest is missing a 192px or 512px icon, ",[25,2079,1181],{},[25,2081,1190],{}," is missing, the page is not served over HTTPS, or there is no registered service worker with a fetch handler. Open DevTools → Application → Manifest and read the installability list — it names what is missing.",[105,2084,2086],{"id":2085},"why-does-chrome-say-invalid-manifest-for-my-extension","Why does Chrome say \"Invalid manifest\" for my extension?",[28,2088,2089,2090,2092,2093,2095],{},"Either the JSON is invalid (trailing comma, comment, single quotes) or a value fails schema validation (missing ",[25,2091,1694],{},", wrong ",[25,2094,1672],{},", malformed permission). Load the extension unpacked and read the error on its card — Chrome names the offending key.",[105,2097,2099],{"id":2098},"can-i-use-the-same-manifestjson-for-a-pwa-and-a-chrome-extension","Can I use the same manifest.json for a PWA and a Chrome extension?",[28,2101,2102,2103,265,2105,638,2107,2110,2111,953,2113,2115],{},"No. They are different specifications with different required keys. ",[25,2104,1672],{},[25,2106,1629],{},[25,2108,2109],{},"background"," mean nothing to a browser reading a web app manifest, and ",[25,2112,1181],{},[25,2114,1190],{}," mean nothing to Chrome loading an extension. Keep them in separate files in separate projects.",[105,2117,2119],{"id":2118},"where-should-the-file-go","Where should the file go?",[28,2121,2122,2123,2125,2126,2129],{},"For a PWA, somewhere served at a stable public URL — commonly ",[25,2124,1264],{}," at the site root, referenced by an absolute ",[25,2127,2128],{},"href",". For a Chrome extension, the root of the extension folder, next to the scripts it references.",[71,2131,916],{"id":915},[135,2133,2134,2142,2150,2157,2164],{},[138,2135,2136,2139,2140,69],{},[32,2137,2138],{},"Writing a manifest now?"," Format and validate it in the ",[57,2141,714],{"href":713},[138,2143,2144,2147,2148,69],{},[32,2145,2146],{},"Already broken?"," Fix commas, quotes, and comments with ",[57,2149,60],{"href":59},[138,2151,2152,940,2155,69],{},[32,2153,2154],{},"New to JSON files?",[57,2156,957],{"href":956},[138,2158,2159,948,2162,69],{},[32,2160,2161],{},"Fighting comments or trailing commas?",[57,2163,1562],{"href":1561},[138,2165,2166,948,2169,69],{},[32,2167,2168],{},"Debugging a parse error?",[57,2170,68],{"href":67},[2172,2173],"hr",{},[28,2175,2176],{},[113,2177,2178],{},"All tools on JSON Toolbox run entirely in your browser. Your data never leaves your device.",{"title":23,"searchDepth":959,"depth":959,"links":2180},[2181,2182,2183,2191,2192,2193,2200,2201,2202,2203,2212],{"id":1047,"depth":959,"text":1048},{"id":1141,"depth":959,"text":1142},{"id":1238,"depth":959,"text":1239,"children":2184},[2185,2186,2187,2188,2189,2190],{"id":1242,"depth":964,"text":1243},{"id":1267,"depth":964,"text":1268},{"id":1327,"depth":964,"text":1328},{"id":1347,"depth":964,"text":1348},{"id":1365,"depth":964,"text":1366},{"id":1387,"depth":964,"text":1388},{"id":1418,"depth":959,"text":1419},{"id":1565,"depth":959,"text":1566},{"id":1636,"depth":959,"text":1637,"children":2194},[2195,2196,2197,2198,2199],{"id":1640,"depth":964,"text":1641},{"id":1650,"depth":964,"text":1651},{"id":1703,"depth":964,"text":1704},{"id":1727,"depth":964,"text":1348},{"id":1750,"depth":964,"text":1751},{"id":1781,"depth":959,"text":1782},{"id":1913,"depth":959,"text":1914},{"id":1972,"depth":959,"text":1973},{"id":800,"depth":959,"text":801,"children":2204},[2205,2206,2207,2208,2209,2210,2211],{"id":2029,"depth":964,"text":2030},{"id":2046,"depth":964,"text":2047},{"id":2053,"depth":964,"text":2054},{"id":2073,"depth":964,"text":2074},{"id":2085,"depth":964,"text":2086},{"id":2098,"depth":964,"text":2099},{"id":2118,"depth":964,"text":2119},{"id":915,"depth":959,"text":916},"2026-10-01T00:00:00.000Z","Create a manifest.json for a PWA or Chrome extension: required fields, minimal examples, install rules, and how to debug an invalid manifest.","\u002Fblog\u002Fcover\u002Fen\u002Fhow-to-create-manifest-json-cover.svg",[998],{},"\u002Fen\u002Fblog\u002Fhow-to-create-manifest-json",{"slug":2220,"text":2221,"btn":2222},"json-editor","Writing a manifest? Format and validate it before you ship:","Open JSON Editor",{"title":1016,"description":2214},"en\u002Fblog\u002Fhow-to-create-manifest-json",[1009,1028,2226,2227,1079],"PWA","Chrome Extension","dhcMuyNAGtdBybHlCRCMA-XP6HsZqgyITOEyM1yK9vE",{"id":2230,"title":2231,"author":7,"body":2232,"category":991,"date":3344,"description":3345,"draft":994,"extension":995,"h1":2237,"image":3346,"lastmod":3344,"locales":3347,"meta":3348,"navigation":1000,"path":3349,"promo":3350,"seo":3352,"stem":3353,"tags":3354,"__hash__":3358},"blog\u002Fen\u002Fblog\u002Fhow-to-create-json-file.md","How to Create a JSON File: Step-by-Step Guide",{"type":9,"value":2233,"toc":3310},[2234,2238,2245,2252,2255,2259,2262,2268,2274,2290,2293,2326,2341,2345,2351,2355,2360,2408,2423,2427,2432,2459,2464,2468,2474,2490,2494,2497,2537,2551,2555,2558,2564,2571,2577,2581,2584,2727,2745,2749,2884,2890,2894,2897,2903,2912,2918,2924,2941,2947,2951,2954,2975,2978,2982,2985,2989,2996,3014,3018,3024,3030,3034,3037,3043,3046,3048,3053,3056,3065,3071,3084,3103,3116,3119,3126,3128,3132,3151,3155,3158,3165,3176,3180,3186,3190,3209,3213,3222,3231,3246,3250,3258,3260,3304,3306],[12,2235,2237],{"id":2236},"how-to-create-a-json-file-step-by-step-guide-for-beginners","How to Create a JSON File: Step-by-Step Guide for Beginners",[28,2239,2240,2241,2244],{},"A JSON file is just a text file with the ",[25,2242,2243],{},".json"," extension. You do not need special software, a paid tool, or an account — Notepad, TextEdit, and VS Code can all create one.",[28,2246,2247,2248,2251],{},"What trips people up is rarely the writing. It is the saving: Windows silently appending ",[25,2249,2250],{},".txt",", macOS TextEdit saving rich text instead of plain text, and a missing comma that makes the file unreadable to every JSON parser.",[28,2253,2254],{},"This guide covers what a JSON file is, how to create one on each operating system, the syntax rules that decide whether your file is valid, how to validate it, and how to generate JSON files from code.",[71,2256,2258],{"id":2257},"what-is-a-json-file","What is a JSON file?",[28,2260,2261],{},"JSON (JavaScript Object Notation) is a plain-text data format built from two structures — objects and arrays — and six value types: string, number, boolean, null, object, and array.",[28,2263,2264,2265,2267],{},"A JSON file is a text file that contains JSON and uses the ",[25,2266,2243],{}," extension:",[17,2269,2272],{"className":2270,"code":2271,"language":1354,"meta":23},[1352],"{\n  \"name\": \"Ada Lovelace\",\n  \"role\": \"engineer\",\n  \"active\": true,\n  \"projects\": [\"analytical-engine\", \"bernoulli-numbers\"]\n}\n",[25,2273,2271],{"__ignoreMap":23},[28,2275,2276,2277,2282,2283,2286,2287,2289],{},"Per ",[57,2278,2281],{"href":2279,"rel":2280},"https:\u002F\u002Fwww.rfc-editor.org\u002Frfc\u002Frfc8259",[81],"RFC 8259",", the registered media type is ",[25,2284,2285],{},"application\u002Fjson"," and the file extension is ",[25,2288,2243],{},". Because it is plain text, you can read and edit it anywhere — and any programming language can parse it.",[28,2291,2292],{},"JSON files are used for:",[135,2294,2295,2308,2314,2320],{},[138,2296,2297,735,2300,265,2303,265,2306,69],{},[32,2298,2299],{},"Configuration:",[25,2301,2302],{},"package.json",[25,2304,2305],{},"tsconfig.json",[25,2307,1028],{},[138,2309,2310,2313],{},[32,2311,2312],{},"Data exchange:"," API request and response bodies.",[138,2315,2316,2319],{},[32,2317,2318],{},"Saved data:"," exports, fixtures, and test datasets.",[138,2321,2322,2325],{},[32,2323,2324],{},"Logs:"," structured one-line records.",[28,2327,2328,2329,2332,2333,2336,2337,69],{},"A JSON file has one root value. It is either an object (",[25,2330,2331],{},"{ }",") or an array (",[25,2334,2335],{},"[ ]",") in practice, and everything else nests inside it. If you are new to the format itself, start with ",[57,2338,2340],{"href":2339},"\u002Fblog\u002Fwhat-is-json","What Is JSON? Structure, Syntax, and Common Mistakes",[71,2342,2344],{"id":2343},"how-to-create-a-json-file-with-a-text-editor","How to create a JSON file with a text editor",[28,2346,2347,2348,2350],{},"Every operating system follows the same three steps: write the JSON, save the file with a ",[25,2349,2243],{}," extension as UTF-8, then validate it. The default editors differ, and each has one trap.",[105,2352,2354],{"id":2353},"windows-notepad-or-vs-code","Windows: Notepad or VS Code",[28,2356,2357],{},[32,2358,2359],{},"Notepad:",[530,2361,2362,2365,2371,2387,2393],{},[138,2363,2364],{},"Open Notepad and paste or type your JSON.",[138,2366,2367,2368,69],{},"Choose ",[32,2369,2370],{},"File → Save As",[138,2372,1810,2373,2376,2377,2380,2381,2383,2384,69],{},[32,2374,2375],{},"Save as type"," to ",[32,2378,2379],{},"All Files (*.*)"," — this is the step people skip. If it stays on \"Text Documents (*.txt)\", Notepad appends ",[25,2382,2250],{}," and you get ",[25,2385,2386],{},"data.json.txt",[138,2388,2389,2390,69],{},"Enter the full file name including the extension: ",[25,2391,2392],{},"data.json",[138,2394,1810,2395,2376,2398,2401,2402,953,2405,69],{},[32,2396,2397],{},"Encoding",[32,2399,2400],{},"UTF-8",", then save. Recent versions of Notepad default to UTF-8, but check the dropdown — it is the difference between ",[25,2403,2404],{},"café",[25,2406,2407],{},"café",[28,2409,2410,2413,2414,2416,2417,2419,2420,69],{},[32,2411,2412],{},"VS Code"," is easier: create a new file, select ",[32,2415,1009],{}," as the language mode, paste the content, and save as ",[25,2418,2392],{},". VS Code validates as you type and can format the document with ",[32,2421,2422],{},"Format Document",[105,2424,2426],{"id":2425},"macos-textedit-or-vs-code","macOS: TextEdit or VS Code",[28,2428,2429],{},[32,2430,2431],{},"TextEdit:",[530,2433,2434,2444,2447,2456],{},[138,2435,2436,2437,1740,2440,2443],{},"Open TextEdit and choose ",[32,2438,2439],{},"Format → Make Plain Text",[32,2441,2442],{},"Shift + Cmd + T",") before typing. TextEdit defaults to rich text, and saving rich text produces RTF, not JSON.",[138,2445,2446],{},"Paste or type your JSON.",[138,2448,2449,2450,2452,2453,2455],{},"In the save dialog, type the full name with the extension — ",[25,2451,2392],{}," — and make sure the option to append ",[25,2454,2250],{}," when no extension is given is not active.",[138,2457,2458],{},"Save.",[28,2460,2461,2463],{},[32,2462,2412],{}," avoids both problems and is the better default on macOS too.",[105,2465,2467],{"id":2466},"linux-nano-gedit-or-vs-code","Linux: nano, gedit, or VS Code",[17,2469,2472],{"className":2470,"code":2471,"language":1951,"meta":23},[1949],"nano data.json\n",[25,2473,2471],{"__ignoreMap":23},[28,2475,2476,2477,953,2480,2483,2484,2487,2488,69],{},"Type or paste the JSON, then press ",[32,2478,2479],{},"Ctrl + O",[32,2481,2482],{},"Enter"," to save, ",[32,2485,2486],{},"Ctrl + X"," to exit. Desktop editors such as gedit and VS Code work the same way — just make sure the file name ends in ",[25,2489,2243],{},[105,2491,2493],{"id":2492},"the-saving-checklist","The saving checklist",[28,2495,2496],{},"Whatever editor you use, confirm three things before you trust the file:",[162,2498,2499,2509],{},[165,2500,2501],{},[168,2502,2503,2506],{},[171,2504,2505],{},"Check",[171,2507,2508],{},"Why it matters",[181,2510,2511,2521,2529],{},[168,2512,2513,2518],{},[186,2514,2515,2516],{},"The name ends in ",[25,2517,2243],{},[186,2519,2520],{},"The extension tells editors, servers, and tools how to treat the file.",[168,2522,2523,2526],{},[186,2524,2525],{},"It is plain text, not rich text",[186,2527,2528],{},"Word, Google Docs, and TextEdit's rich-text mode add formatting that is not JSON.",[168,2530,2531,2534],{},[186,2532,2533],{},"The encoding is UTF-8",[186,2535,2536],{},"Non-UTF-8 files produce garbled characters; a UTF-8 BOM makes some parsers throw.",[28,2538,2539,2540,2542,2543,2546,2547,2550],{},"If your file might actually be ",[25,2541,2386],{},", check from a terminal (",[25,2544,2545],{},"dir"," on Windows, ",[25,2548,2549],{},"ls"," on macOS and Linux) rather than trusting File Explorer or Finder — both hide known extensions by default.",[71,2552,2554],{"id":2553},"step-by-step-create-your-first-json-file","Step-by-step: create your first JSON file",[28,2556,2557],{},"Here is a complete first file. It is an object with four keys and one nested array:",[17,2559,2562],{"className":2560,"code":2561,"language":1354,"meta":23},[1352],"{\n  \"project\": \"json-toolbox\",\n  \"version\": \"1.0.0\",\n  \"author\": \"Ada\",\n  \"tags\": [\"json\", \"config\"]\n}\n",[25,2563,2561],{"__ignoreMap":23},[28,2565,2566,2567,2570],{},"Save it as ",[25,2568,2569],{},"project.json",". An array of objects is equally valid as the root value:",[17,2572,2575],{"className":2573,"code":2574,"language":1354,"meta":23},[1352],"[\n  { \"id\": 1, \"name\": \"Ada\", \"active\": true },\n  { \"id\": 2, \"name\": \"Lin\", \"active\": false }\n]\n",[25,2576,2574],{"__ignoreMap":23},[105,2578,2580],{"id":2579},"syntax-rules-that-decide-whether-the-file-works","Syntax rules that decide whether the file works",[28,2582,2583],{},"JSON is strict. These are the rules that cause most first-file failures:",[162,2585,2586,2599],{},[165,2587,2588],{},[168,2589,2590,2593,2596],{},[171,2591,2592],{},"Rule",[171,2594,2595],{},"Valid",[171,2597,2598],{},"Invalid",[181,2600,2601,2616,2631,2646,2660,2673,2694,2714],{},[168,2602,2603,2606,2611],{},[186,2604,2605],{},"Strings use double quotes",[186,2607,2608],{},[25,2609,2610],{},"\"name\"",[186,2612,2613],{},[25,2614,2615],{},"'name'",[168,2617,2618,2621,2626],{},[186,2619,2620],{},"Keys are quoted",[186,2622,2623],{},[25,2624,2625],{},"{ \"name\": \"Ada\" }",[186,2627,2628],{},[25,2629,2630],{},"{ name: \"Ada\" }",[168,2632,2633,2636,2641],{},[186,2634,2635],{},"No trailing comma",[186,2637,2638],{},[25,2639,2640],{},"{ \"a\": 1, \"b\": 2 }",[186,2642,2643],{},[25,2644,2645],{},"{ \"a\": 1, \"b\": 2, }",[168,2647,2648,2651,2655],{},[186,2649,2650],{},"Members separated by commas",[186,2652,2653],{},[25,2654,2640],{},[186,2656,2657],{},[25,2658,2659],{},"{ \"a\": 1 \"b\": 2 }",[168,2661,2662,2665,2668],{},[186,2663,2664],{},"No comments",[186,2666,2667],{},"—",[186,2669,2670],{},[25,2671,2672],{},"{ \"a\": 1 } \u002F\u002F note",[168,2674,2675,2678,2686],{},[186,2676,2677],{},"Numbers have no leading zeros or hex",[186,2679,2680,265,2683],{},[25,2681,2682],{},"42",[25,2684,2685],{},"3.14",[186,2687,2688,265,2691],{},[25,2689,2690],{},"042",[25,2692,2693],{},"0x1F",[168,2695,2696,2706,2710],{},[186,2697,2698,2699,265,2701,287,2703],{},"No ",[25,2700,313],{},[25,2702,686],{},[25,2704,2705],{},"Infinity",[186,2707,2708],{},[25,2709,337],{},[186,2711,2712],{},[25,2713,686],{},[168,2715,2716,2719,2724],{},[186,2717,2718],{},"Escape newlines inside strings",[186,2720,2721],{},[25,2722,2723],{},"\"line1\\nline2\"",[186,2725,2726],{},"a literal line break inside a string",[28,2728,2729,2730,1191,2733,953,2735,2737,2738,2740,2741,2744],{},"Two of these deserve a note. ",[32,2731,2732],{},"Comments are not part of JSON",[25,2734,2060],{},[25,2736,2063],{}," make the file invalid, and only tools that explicitly accept JSONC will read it; see ",[57,2739,1562],{"href":1561},". And ",[32,2742,2743],{},"trailing commas are invalid"," even though they are fine in JavaScript object literals, which is why copied-and-pasted config so often fails to parse.",[71,2746,2748],{"id":2747},"common-mistakes-and-how-to-fix-them","Common mistakes and how to fix them",[162,2750,2751,2761],{},[165,2752,2753],{},[168,2754,2755,2757,2759],{},[171,2756,1428],{},[171,2758,1431],{},[171,2760,1434],{},[181,2762,2763,2782,2793,2808,2821,2838,2857,2871],{},[168,2764,2765,2770,2773],{},[186,2766,2767,2768],{},"File is named ",[25,2769,2386],{},[186,2771,2772],{},"Save dialog type was \"Text Documents\", or the extension is hidden",[186,2774,2775,2776,2779,2780],{},"Re-save with ",[32,2777,2778],{},"Save as type: All Files"," and type ",[25,2781,2392],{},[168,2783,2784,2787,2790],{},[186,2785,2786],{},"Parser reports an error at line 1, column 1",[186,2788,2789],{},"UTF-8 BOM at the start of the file",[186,2791,2792],{},"Save as UTF-8 without BOM",[168,2794,2795,2802,2805],{},[186,2796,2797,2799,2800],{},[25,2798,2404],{}," becomes ",[25,2801,2407],{},[186,2803,2804],{},"File saved as ANSI \u002F non-UTF-8",[186,2806,2807],{},"Re-save with UTF-8 encoding",[168,2809,2810,2813,2816],{},[186,2811,2812],{},"Editor shows formatting or fonts",[186,2814,2815],{},"File was saved as rich text (RTF\u002FDOCX)",[186,2817,2818,2819],{},"Use a plain-text editor and save as ",[25,2820,2243],{},[168,2822,2823,2828,2835],{},[186,2824,2825],{},[25,2826,2827],{},"SyntaxError: Unexpected token }",[186,2829,2830,2831,223,2833],{},"Trailing comma before ",[25,2832,41],{},[25,2834,268],{},[186,2836,2837],{},"Remove the last comma in the object or array",[168,2839,2840,2845,2852],{},[186,2841,2842],{},[25,2843,2844],{},"SyntaxError: Unexpected token \u002F",[186,2846,1051,2847,223,2849,2851],{},[25,2848,2060],{},[25,2850,2063],{}," comment",[186,2853,2854,2855],{},"Remove comments, or convert with ",[57,2856,1900],{"href":1899},[168,2858,2859,2865,2868],{},[186,2860,2861,2864],{},[25,2862,2863],{},"Unexpected token '"," in JSON`",[186,2866,2867],{},"Single-quoted strings",[186,2869,2870],{},"Replace with double quotes",[168,2872,2873,2876,2879],{},[186,2874,2875],{},"Error mentions an unexpected string or colon",[186,2877,2878],{},"Unquoted key",[186,2880,2881,2882],{},"Quote the key: ",[25,2883,2625],{},[28,2885,2886,2887,2889],{},"When several of these are present at once, fixing them by hand is slow. Paste the file into ",[57,2888,60],{"href":59},", which fixes trailing commas, single quotes, unquoted keys, missing brackets, comments, and Python-style constants, then copy or download the valid result.",[71,2891,2893],{"id":2892},"how-to-validate-a-json-file","How to validate a JSON file",[28,2895,2896],{},"\"Valid\" has one meaning for a JSON file: a strict parser can read it without error. Four ways to check:",[28,2898,2899,2902],{},[32,2900,2901],{},"1. Editor feedback."," VS Code underlines syntax errors as you type and shows the message on hover. This catches most problems before you save.",[28,2904,2905,2908,2909,2911],{},[32,2906,2907],{},"2. In the browser."," Paste or open the file in the ",[57,2910,714],{"href":713},". It validates live, highlights syntax, and lets you format or minify the document before you copy or download it — no account and no upload, because it runs in your browser.",[28,2913,2914,2917],{},[32,2915,2916],{},"3. Command line."," Both of these parse the file and print it, so a parse error means the file is invalid:",[17,2919,2922],{"className":2920,"code":2921,"language":1951,"meta":23},[1949],"jq . data.json\npython -m json.tool data.json\n",[25,2923,2921],{"__ignoreMap":23},[28,2925,2926,2929,2930,2932,2933,2935,2936,2940],{},[32,2927,2928],{},"4. Schema validation."," Syntax is only the first layer. If the file has to match an expected structure — required fields, types, ranges — validate it against a JSON Schema. Generate a starting schema from a representative file with the ",[57,2931,1963],{"href":1962},", then check data against it with the ",[57,2934,1968],{"href":1967},". See ",[57,2937,2939],{"href":2938},"\u002Fblog\u002Fjson-validation-syntax-vs-schema","JSON Validation Explained"," for how the layers differ.",[28,2942,2943,2944,2946],{},"If a file fails to parse and you are not sure why, ",[57,2945,68],{"href":67}," walks through the error messages one by one.",[71,2948,2950],{"id":2949},"create-a-json-file-online","Create a JSON file online",[28,2952,2953],{},"If you would rather not deal with Save As dialogs, a browser-based editor does the same job and hands you a downloadable file:",[135,2955,2956,2966],{},[138,2957,2958,2962,2963,2965],{},[32,2959,2960],{},[57,2961,714],{"href":713}," — paste or open JSON, edit it in a syntax-highlighted editor with live validation, format or minify it, then copy or download the ",[25,2964,2243],{}," file. This is the closest equivalent to \"create a JSON file online\" and works on any OS, including Chromebooks and tablets.",[138,2967,2968,2974],{},[32,2969,2970],{},[57,2971,2973],{"href":2972},"\u002Ftools\u002Fconvert\u002Fjson-array-generator","JSON Array Generator"," — if you need a file full of sample records rather than one hand-written object, set the number of items and the field names and download a pretty-printed array. Useful for test fixtures and demos.",[28,2976,2977],{},"Both run entirely in your browser, so nothing you paste is sent to a server.",[71,2979,2981],{"id":2980},"generate-json-files-from-code","Generate JSON files from code",[28,2983,2984],{},"When data already lives in your program, do not hand-write the file — let the code write it.",[105,2986,2988],{"id":2987},"python","Python",[17,2990,2994],{"className":2991,"code":2993,"language":2987,"meta":23},[2992],"language-python","import json\n\ndata = {\n    \"project\": \"json-toolbox\",\n    \"version\": \"1.0.0\",\n    \"author\": \"Ada\",\n    \"tags\": [\"json\", \"config\"],\n}\n\nwith open(\"project.json\", \"w\", encoding=\"utf-8\") as f:\n    json.dump(data, f, indent=2, ensure_ascii=False)\n    f.write(\"\\n\")\n",[25,2995,2993],{"__ignoreMap":23},[28,2997,2998,3001,3002,3005,3006,3009,3010,3013],{},[25,2999,3000],{},"indent=2"," produces readable output; drop it for a compact file. ",[25,3003,3004],{},"ensure_ascii=False"," keeps non-ASCII characters readable instead of escaping them, which is why opening the file with ",[25,3007,3008],{},"encoding=\"utf-8\""," matters. Use ",[25,3011,3012],{},"json.dumps(data)"," when you want the JSON as a string rather than a file.",[105,3015,3017],{"id":3016},"nodejs","Node.js",[17,3019,3022],{"className":3020,"code":3021,"language":94,"meta":23},[92],"import { writeFile } from 'node:fs\u002Fpromises'\n\nconst data = {\n  project: 'json-toolbox',\n  version: '1.0.0',\n  author: 'Ada',\n  tags: ['json', 'config'],\n}\n\nawait writeFile('project.json', JSON.stringify(data, null, 2) + '\\n', 'utf8')\n",[25,3023,3021],{"__ignoreMap":23},[28,3025,3026,3029],{},[25,3027,3028],{},"JSON.stringify(value, null, 2)"," adds two-space indentation; omit the last two arguments for minified output.",[105,3031,3033],{"id":3032},"in-the-browser","In the browser",[28,3035,3036],{},"To let a user download a file your page generated:",[17,3038,3041],{"className":3039,"code":3040,"language":94,"meta":23},[92],"const text = JSON.stringify(data, null, 2)\nconst blob = new Blob([text], { type: 'application\u002Fjson' })\nconst url = URL.createObjectURL(blob)\n\nconst a = document.createElement('a')\na.href = url\na.download = 'project.json'\na.click()\n\nURL.revokeObjectURL(url)\n",[25,3042,3040],{"__ignoreMap":23},[28,3044,3045],{},"This never touches a server — the file is assembled in the page and downloaded from memory.",[71,3047,1048],{"id":1047},[28,3049,1051,3050,3052],{},[25,3051,1028],{}," is not a different format. It is an ordinary JSON file whose contents are defined by whichever platform reads it — so \"how do I create one\" really means \"what fields does this platform expect\".",[28,3054,3055],{},"Three common cases:",[28,3057,3058,3061,3062,69],{},[32,3059,3060],{},"Progressive Web App (web app manifest)"," — describes how your app appears when installed: name, icons, start URL, and display mode. Referenced from HTML with ",[25,3063,3064],{},"\u003Clink rel=\"manifest\" href=\"\u002Fmanifest.json\">",[17,3066,3069],{"className":3067,"code":3068,"language":1354,"meta":23},[1352],"{\n  \"name\": \"JSON Toolbox\",\n  \"short_name\": \"JSON Toolbox\",\n  \"start_url\": \"\u002F\",\n  \"display\": \"standalone\",\n  \"background_color\": \"#ffffff\",\n  \"theme_color\": \"#0284c7\",\n  \"icons\": [\n    {\n      \"src\": \"\u002Ficons\u002Ficon-192.png\",\n      \"sizes\": \"192x192\",\n      \"type\": \"image\u002Fpng\"\n    },\n    {\n      \"src\": \"\u002Ficons\u002Ficon-512.png\",\n      \"sizes\": \"512x512\",\n      \"type\": \"image\u002Fpng\"\n    }\n  ]\n}\n",[25,3070,3068],{"__ignoreMap":23},[28,3072,3073,3074,638,3078,3083],{},"The specification is the ",[57,3075,3077],{"href":1148,"rel":3076},[81],"W3C Web Application Manifest",[57,3079,3082],{"href":3080,"rel":3081},"https:\u002F\u002Fweb.dev\u002Farticles\u002Fadd-manifest",[81],"web.dev"," has a practical walkthrough.",[28,3085,3086,3089,3090,3092,3093,3096,3097,3102],{},[32,3087,3088],{},"Chrome extension"," — every extension has a ",[25,3091,1028],{}," declaring its name, version, and permissions. The current version is ",[57,3094,1578],{"href":1590,"rel":3095},[81],"; see MDN's ",[57,3098,3100,1599],{"href":1595,"rel":3099},[81],[25,3101,1028],{}," for the key list.",[28,3104,3105,3108,3109,3111,3112,3115],{},[32,3106,3107],{},"Framework manifests"," — frameworks generate or consume their own. Next.js, for example, supports ",[25,3110,1987],{}," (or ",[25,3113,3114],{},"manifest.ts",") and serves the file for you.",[28,3117,3118],{},"The syntax rules in this guide apply to all of them: valid JSON first, correct fields second. Many editors accept comments in these files because they read them as JSONC — but the platform that consumes the file may not, so check before shipping comments.",[28,3120,3121,3122,69],{},"For step-by-step examples with the required fields for each spec — PWA web app manifests and Chrome extension Manifest V3 — see ",[57,3123,3125],{"href":3124},"\u002Fblog\u002Fhow-to-create-manifest-json","How to Create a manifest.json File",[71,3127,801],{"id":800},[105,3129,3131],{"id":3130},"can-i-create-a-json-file-in-notepad","Can I create a JSON file in Notepad?",[28,3133,3134,3135,3137,3138,2376,3140,3142,3143,3145,3146,3148,3149,69],{},"Yes. Write the JSON, choose ",[32,3136,2370],{},", set ",[32,3139,2375],{},[32,3141,2379],{},", type the name as ",[25,3144,2392],{},", and pick ",[32,3147,2400],{}," as the encoding. Skipping \"All Files\" is what produces ",[25,3150,2386],{},[105,3152,3154],{"id":3153},"do-i-need-special-software-to-create-a-json-file","Do I need special software to create a JSON file?",[28,3156,3157],{},"No. Any plain-text editor works — Notepad, TextEdit, nano, VS Code. A code editor adds syntax highlighting and live validation, which is why it is recommended, but it is not required.",[105,3159,3161,3162,3164],{"id":3160},"how-do-i-make-a-json-file-on-a-mac","How do I make a ",[25,3163,2243],{}," file on a Mac?",[28,3166,3167,3168,1740,3170,3172,3173,3175],{},"Use TextEdit with ",[32,3169,2439],{},[32,3171,2442],{},") first, then save with the full name ",[25,3174,2392],{},". Or use VS Code, which saves plain text with the extension you type and validates as you go.",[105,3177,3179],{"id":3178},"why-does-my-json-file-not-work-even-though-it-looks-correct","Why does my JSON file not work even though it looks correct?",[28,3181,3182,3183,3185],{},"Most often it is one of four things: the file is actually ",[25,3184,2386],{},", it was saved as rich text or with a BOM, it contains a trailing comma, or it has comments. Validate the file — an error message with a line and column points straight at the problem.",[105,3187,3189],{"id":3188},"can-a-json-file-have-comments","Can a JSON file have comments?",[28,3191,3192,3193,953,3195,3197,3198,3201,3202,3204,3205,3208],{},"No. Standard JSON has no comment syntax, so ",[25,3194,2060],{},[25,3196,2063],{}," make the file invalid. Use a ",[25,3199,3200],{},"_comment"," key, keep documentation outside the file, or work in JSONC and strip comments before shipping. Full details in ",[57,3203,1562],{"href":1561},", and the ",[57,3206,3207],{"href":1899},"JSONC to JSON Converter"," removes them for you.",[105,3210,3212],{"id":3211},"is-a-json-file-the-same-as-a-javascript-object","Is a JSON file the same as a JavaScript object?",[28,3214,3215,3216,3219,3220,69],{},"No. A JSON file is text; a JavaScript object literal is code. JavaScript allows unquoted keys, trailing commas, single quotes, and comments — none of which are valid JSON. That is why an object copied out of a ",[25,3217,3218],{},".js"," file often fails ",[25,3221,84],{},[105,3223,3225,3226,953,3228,3230],{"id":3224},"what-is-the-difference-between-json-and-webmanifest","What is the difference between ",[25,3227,2243],{},[25,3229,2036],{},"?",[28,3232,3233,3234,3236,3237,3239,3240,3242,3243,3245],{},"Both contain JSON; only the convention differs. ",[25,3235,2036],{}," is the file extension recommended by the W3C for a web app manifest, served as ",[25,3238,2040],{},", while ",[25,3241,2243],{}," is the general extension for any JSON document. Many projects still use ",[25,3244,1028],{}," with no issue.",[105,3247,3249],{"id":3248},"how-large-can-a-json-file-be","How large can a JSON file be?",[28,3251,3252,3253,3257],{},"JSON itself sets no size limit. Practical limits come from the tool reading the file: editor memory, parser configuration, and server upload caps. For testing how your own tools behave, the ",[57,3254,3256],{"href":3255},"\u002Fblog\u002Ffree-realistic-json-test-data","free realistic JSON test datasets"," range from small demos to large files.",[71,3259,916],{"id":915},[135,3261,3262,3274,3282,3290,3298],{},[138,3263,3264,3267,3268,3270,3271,3273],{},[32,3265,3266],{},"Ready to write one?"," Open the ",[57,3269,714],{"href":713}," — paste, validate, format, and download a ",[25,3272,2243],{}," file without installing anything.",[138,3275,3276,3279,3280,69],{},[32,3277,3278],{},"Need sample records?"," Generate an array with the ",[57,3281,2973],{"href":2972},[138,3283,3284,3287,3288,69],{},[32,3285,3286],{},"File already broken?"," Fix trailing commas, quotes, and comments with ",[57,3289,60],{"href":59},[138,3291,3292,940,3295,69],{},[32,3293,3294],{},"Wondering about comments?",[57,3296,3297],{"href":1561},"Comments in JSON: Why They're Not Allowed and What to Use Instead",[138,3299,3300,948,3302,69],{},[32,3301,2168],{},[57,3303,68],{"href":67},[2172,3305],{},[28,3307,3308],{},[113,3309,2178],{},{"title":23,"searchDepth":959,"depth":959,"links":3311},[3312,3313,3319,3322,3323,3324,3325,3330,3331,3343],{"id":2257,"depth":959,"text":2258},{"id":2343,"depth":959,"text":2344,"children":3314},[3315,3316,3317,3318],{"id":2353,"depth":964,"text":2354},{"id":2425,"depth":964,"text":2426},{"id":2466,"depth":964,"text":2467},{"id":2492,"depth":964,"text":2493},{"id":2553,"depth":959,"text":2554,"children":3320},[3321],{"id":2579,"depth":964,"text":2580},{"id":2747,"depth":959,"text":2748},{"id":2892,"depth":959,"text":2893},{"id":2949,"depth":959,"text":2950},{"id":2980,"depth":959,"text":2981,"children":3326},[3327,3328,3329],{"id":2987,"depth":964,"text":2988},{"id":3016,"depth":964,"text":3017},{"id":3032,"depth":964,"text":3033},{"id":1047,"depth":959,"text":1048},{"id":800,"depth":959,"text":801,"children":3332},[3333,3334,3335,3337,3338,3339,3340,3342],{"id":3130,"depth":964,"text":3131},{"id":3153,"depth":964,"text":3154},{"id":3160,"depth":964,"text":3336},"How do I make a .json file on a Mac?",{"id":3178,"depth":964,"text":3179},{"id":3188,"depth":964,"text":3189},{"id":3211,"depth":964,"text":3212},{"id":3224,"depth":964,"text":3341},"What is the difference between .json and .webmanifest?",{"id":3248,"depth":964,"text":3249},{"id":915,"depth":959,"text":916},"2026-09-30T00:00:00.000Z","Create a JSON file on Windows, macOS, or Linux: write valid JSON, avoid the .json.txt trap, validate the result, and generate files from code.","\u002Fblog\u002Fcover\u002Fen\u002Fhow-to-create-json-file-cover.svg",[998],{},"\u002Fen\u002Fblog\u002Fhow-to-create-json-file",{"slug":2220,"text":3351,"btn":2222},"Want to write, format, and validate JSON without installing anything?",{"title":2231,"description":3345},"en\u002Fblog\u002Fhow-to-create-json-file",[1009,3355,714,3356,3357],"Beginners","File Format","Tutorial","i2tDp54BDyFQSPRjbCkSB9YU3FA0Ko8wTFj8gRCufeE",{"id":3360,"title":3361,"author":7,"body":3362,"category":991,"date":4461,"description":4462,"draft":994,"extension":995,"h1":3297,"image":4463,"lastmod":4461,"locales":4464,"meta":4465,"navigation":1000,"path":4466,"promo":4467,"seo":4471,"stem":4472,"tags":4473,"__hash__":4476},"blog\u002Fen\u002Fblog\u002Fjson-comments.md","Comments in JSON: Why Not Allowed & What to Use",{"type":9,"value":3363,"toc":4427},[3364,3367,3380,3391,3395,3401,3404,3420,3423,3431,3436,3442,3446,3453,3456,3459,3473,3476,3480,3483,3489,3552,3555,3560,3564,3567,3571,3574,3580,3595,3600,3608,3613,3624,3630,3634,3645,3649,3657,3661,3669,3682,3686,3689,3693,3705,3708,3711,3717,3721,3727,3758,3766,3769,3773,3779,3796,3799,3803,3980,3986,3990,3997,4003,4019,4025,4032,4036,4048,4051,4057,4071,4078,4081,4099,4103,4107,4110,4116,4122,4125,4129,4135,4141,4144,4148,4162,4165,4202,4208,4242,4245,4249,4252,4269,4277,4279,4283,4299,4303,4306,4310,4323,4326,4333,4342,4346,4354,4358,4361,4365,4376,4378,4421,4423],[12,3365,3297],{"id":3366},"comments-in-json-why-theyre-not-allowed-and-what-to-use-instead",[28,3368,3369,3370,3372,3373,3375,3376,3379],{},"You paste a config file into your code, call ",[25,3371,84],{},", and get ",[25,3374,2844],{},". Everything looks correct — except for the ",[25,3377,3378],{},"\u002F\u002F TODO: bump this after launch"," line at the top.",[28,3381,3382,3383,542,3385,542,3387,3390],{},"Standard JSON has no comment syntax. Not ",[25,3384,2060],{},[25,3386,2063],{},[25,3388,3389],{},"#",". This guide explains why, what actually happens when you add comments, the workarounds that keep your file valid, and how JSONC, JSON5, and HJSON fit in.",[71,3392,3394],{"id":3393},"can-you-put-comments-in-a-json-file","Can you put comments in a JSON file?",[28,3396,3397,3400],{},[32,3398,3399],{},"No."," Standard JSON does not allow comments anywhere in the document — not inside the top-level object or array, and not outside it either.",[28,3402,3403],{},"Both current JSON specifications define a grammar with no comment tokens:",[135,3405,3406,3412],{},[138,3407,3408,3411],{},[57,3409,2281],{"href":2279,"rel":3410},[81]," (The JavaScript Object Notation Data Interchange Format)",[138,3413,3414,3419],{},[57,3415,3418],{"href":3416,"rel":3417},"https:\u002F\u002Fwww.ecma-international.org\u002Fpublications-and-standards\u002Fstandards\u002Fecma-404\u002F",[81],"ECMA-404"," (The JSON Data Interchange Syntax)",[28,3421,3422],{},"A file that contains comments is not valid JSON, even when every other character is perfect:",[17,3424,3429],{"className":3425,"code":3427,"language":3428,"meta":23},[3426],"language-jsonc","{\n  \u002F\u002F Display name shown in the UI\n  \"name\": \"Ada\",\n  \"age\": 30\n}\n","jsonc",[25,3430,3427],{"__ignoreMap":23},[28,3432,3433,3435],{},[25,3434,84],{}," on that string throws:",[17,3437,3440],{"className":3438,"code":3439,"language":22,"meta":23},[20],"SyntaxError: Unexpected token \u002F in JSON at position 4\n",[25,3441,3439],{"__ignoreMap":23},[71,3443,3445],{"id":3444},"why-doesnt-json-allow-comments","Why doesn't JSON allow comments?",[28,3447,3448,3449,3452],{},"JSON was designed as a ",[32,3450,3451],{},"data interchange format",", not as a configuration language or a programming language. Keeping the grammar tiny was a deliberate goal: a smaller grammar means more parsers, in more languages, that all agree on what a document means.",[28,3454,3455],{},"Douglas Crockford, who popularized JSON, has described removing comments from an early draft after seeing people use them to carry parsing directives — instructions that changed how a document should be interpreted. Different implementations then read the same file differently, which defeated the point of a shared interchange format. Dropping comments removed the ambiguity.",[28,3457,3458],{},"The trade-off is intentional and still visible today:",[135,3460,3461,3467],{},[138,3462,3463,3466],{},[32,3464,3465],{},"Gained:"," a format that is trivial to parse, easy to implement, and highly interoperable.",[138,3468,3469,3472],{},[32,3470,3471],{},"Lost:"," any way to document a JSON file inline.",[28,3474,3475],{},"That trade-off is why comments are the single most-requested JSON \"missing feature\", and why the practical answers are all workarounds or supersets.",[71,3477,3479],{"id":3478},"what-happens-if-you-add-comments-to-a-json-file","What happens if you add comments to a JSON file?",[28,3481,3482],{},"Every strict parser rejects the file. The error differs by tool, but the outcome is the same:",[17,3484,3487],{"className":3485,"code":3486,"language":3428,"meta":23},[3426],"\u002F\u002F Leading comment (invalid)\n{\n  \"name\": \"Ada\", \u002F\u002F inline comment (invalid)\n  \"users\": [\n    \u002F* { \"id\": 1, \"name\": \"Ada\" } *\u002F\n    { \"id\": 2, \"name\": \"Lin\" }\n  ]\n}\n",[25,3488,3486],{"__ignoreMap":23},[162,3490,3491,3501],{},[165,3492,3493],{},[168,3494,3495,3498],{},[171,3496,3497],{},"Parser",[171,3499,3500],{},"Typical result",[181,3502,3503,3514,3527,3539],{},[168,3504,3505,3510],{},[186,3506,3507,3509],{},[25,3508,84],{}," (JavaScript)",[186,3511,3512],{},[25,3513,2844],{},[168,3515,3516,3522],{},[186,3517,3518,3521],{},[25,3519,3520],{},"json.loads()"," (Python)",[186,3523,3524],{},[25,3525,3526],{},"json.decoder.JSONDecodeError",[168,3528,3529,3534],{},[186,3530,3531,3533],{},[25,3532,1944],{}," (CLI)",[186,3535,3536],{},[25,3537,3538],{},"parse error: Invalid literal",[168,3540,3541,3547],{},[186,3542,3543,3546],{},[25,3544,3545],{},"JsonDocument.Parse()"," (.NET)",[186,3548,3549],{},[25,3550,3551],{},"JsonException",[28,3553,3554],{},"The moment comments go in, the file stops being JSON in the RFC sense. Depending on which extra syntax you used, it is now JSONC, JSON5, HJSON, or an unnamed custom variant — and only a parser for that variant can read it.",[28,3556,3557,3558,69],{},"If your JSON is failing to parse for reasons beyond comments, see ",[57,3559,68],{"href":67},[71,3561,3563],{"id":3562},"how-to-comment-in-a-json-file-workarounds-that-stay-valid","How to comment in a JSON file: workarounds that stay valid",[28,3565,3566],{},"If the file must remain strict JSON — because an API, a package manager, or a third-party tool reads it — you have two realistic options.",[105,3568,3570],{"id":3569},"option-1-use-a-dedicated-comment-key","Option 1: Use a dedicated comment key",[28,3572,3573],{},"Reserve a key for documentation and put your notes in it:",[17,3575,3578],{"className":3576,"code":3577,"language":1354,"meta":23},[1352],"{\n  \"_comment\": \"Event schema for the analytics pipeline. Versioned separately from the API.\",\n  \"version\": \"1.2.0\",\n  \"fields\": [\n    {\n      \"name\": \"user_id\",\n      \"type\": \"string\",\n      \"_comment\": \"Primary key. Must be unique per tenant.\"\n    }\n  ]\n}\n",[25,3579,3577],{"__ignoreMap":23},[28,3581,3582,3583,265,3585,265,3588,265,3590,638,3592,69],{},"Common key names include ",[25,3584,3200],{},[25,3586,3587],{},"__comment__",[25,3589,2060],{},[25,3591,1333],{},[25,3593,3594],{},"doc",[28,3596,3597],{},[32,3598,3599],{},"Pros:",[135,3601,3602,3605],{},[138,3603,3604],{},"The file stays valid standard JSON; nothing special is required to read it.",[138,3606,3607],{},"Comments travel with the data, which is useful for example payloads and self-describing schemas.",[28,3609,3610],{},[32,3611,3612],{},"Cons:",[135,3614,3615,3618,3621],{},[138,3616,3617],{},"Comments become part of the data model. Anything iterating over keys will see them.",[138,3619,3620],{},"Consumers must ignore the key. If you serve this JSON from an API, the key ships to clients.",[138,3622,3623],{},"Heavy use clutters the structure.",[28,3625,3626,3627,69],{},"This pattern works well for fixtures, sample payloads, and schema-ish documents. It is a poor fit for hot paths where payload size matters, and for documents validated with ",[25,3628,3629],{},"additionalProperties: false",[105,3631,3633],{"id":3632},"option-2-keep-the-documentation-outside-the-file","Option 2: Keep the documentation outside the file",[28,3635,3636,3637,3640,3641,3644],{},"Keep ",[25,3638,3639],{},"config.json"," strict and describe it elsewhere — a ",[25,3642,3643],{},"README.md",", a JSON Schema file, or your docs site.",[28,3646,3647],{},[32,3648,3599],{},[135,3650,3651,3654],{},[138,3652,3653],{},"The runtime file stays minimal and strictly valid.",[138,3655,3656],{},"Documentation can be richer: Markdown, examples, diagrams, change history.",[28,3658,3659],{},[32,3660,3612],{},[135,3662,3663,3666],{},[138,3664,3665],{},"Documentation can drift from the data unless something enforces the link.",[138,3667,3668],{},"Requires discipline to keep both in sync.",[28,3670,3671,3672,3677,3678,3681],{},"For public APIs and shared data pipelines, this is usually the right choice. A ",[57,3673,3676],{"href":3674,"rel":3675},"https:\u002F\u002Fjson-schema.org\u002Fdocs",[81],"JSON Schema"," is the strongest version of this approach: it documents required fields, types, and ranges in a machine-checkable format. See ",[57,3679,3680],{"href":2938},"JSON Validation Explained: Syntax Checks vs JSON Schema Validation"," for how the layers fit together.",[71,3683,3685],{"id":3684},"jsonc-json5-and-hjson-formats-that-allow-comments","JSONC, JSON5, and HJSON: formats that allow comments",[28,3687,3688],{},"When you need real comments, switch to a superset. Three come up in practice.",[105,3690,3692],{"id":3691},"jsonc-json-with-comments","JSONC — JSON with Comments",[28,3694,3695,3698,3699,3701,3702,3704],{},[32,3696,3697],{},"JSONC"," is the smallest step away from strict JSON: it adds ",[25,3700,2060],{}," line comments and ",[25,3703,2063],{}," block comments and leaves everything else alone. Keys are still quoted, strings still use double quotes, and numbers still follow the JSON grammar.",[28,3706,3707],{},"There is no formal JSONC specification — the name is a convention used by tools that accept \"JSON with comments\". Trailing commas are not part of the definition, but some parsers tolerate them.",[28,3709,3710],{},"Typical use: editor and tool configuration, where humans edit the file by hand and comments explain non-obvious choices.",[17,3712,3715],{"className":3713,"code":3714,"language":3428,"meta":23},[3426],"{\n  \u002F\u002F Matches the deploy target in CI\n  \"region\": \"eu-central-1\",\n  \u002F* Raise together with the API gateway timeout *\u002F\n  \"timeoutMs\": 30000\n}\n",[25,3716,3714],{"__ignoreMap":23},[105,3718,3720],{"id":3719},"json5-json-for-humans","JSON5 — JSON for Humans",[28,3722,3723,3726],{},[32,3724,3725],{},"JSON5"," is a much more relaxed superset aimed at hand-written files. It supports:",[135,3728,3729,3736,3739,3742,3744,3755],{},[138,3730,3731,953,3733,3735],{},[25,3732,2060],{},[25,3734,2063],{}," comments",[138,3737,3738],{},"Trailing commas in objects and arrays",[138,3740,3741],{},"Unquoted keys (when they are valid identifiers)",[138,3743,2867],{},[138,3745,3746,3747,265,3750,265,3752,3754],{},"Extra number forms: hexadecimal, leading ",[25,3748,3749],{},"+",[25,3751,686],{},[25,3753,2705],{},", leading and trailing decimal points",[138,3756,3757],{},"Line continuations in strings",[17,3759,3764],{"className":3760,"code":3762,"language":3763,"meta":23},[3761],"language-json5","{\n  \u002F\u002F User profile in JSON5\n  name: 'Ada',\n  age: 30,\n  roles: [\n    'admin',\n    'editor', \u002F\u002F trailing comma is fine\n  ],\n}\n","json5",[25,3765,3762],{"__ignoreMap":23},[28,3767,3768],{},"JSON5 is comfortable to write and further from strict JSON than JSONC. Nothing that reads strict JSON is guaranteed to read JSON5.",[105,3770,3772],{"id":3771},"hjson-human-json","HJSON — Human JSON",[28,3774,3775,3778],{},[32,3776,3777],{},"HJSON"," pushes furthest toward human readability:",[135,3780,3781,3790,3793],{},[138,3782,3783,3784,265,3786,638,3788],{},"Comments with ",[25,3785,3389],{},[25,3787,2060],{},[25,3789,2063],{},[138,3791,3792],{},"Quoteless keys and string values in most cases",[138,3794,3795],{},"Commas are optional — a newline is usually enough to separate members",[28,3797,3798],{},"It has the smallest ecosystem of the three and shows up mostly in niche configuration tooling.",[105,3800,3802],{"id":3801},"comparison","Comparison",[162,3804,3805,3821],{},[165,3806,3807],{},[168,3808,3809,3812,3815,3817,3819],{},[171,3810,3811],{},"Feature",[171,3813,3814],{},"JSON (RFC 8259)",[171,3816,3697],{},[171,3818,3725],{},[171,3820,3777],{},[181,3822,3823,3839,3853,3867,3882,3895,3907,3921,3947,3963],{},[168,3824,3825,3829,3832,3835,3837],{},[186,3826,3827,3735],{},[25,3828,2060],{},[186,3830,3831],{},"No",[186,3833,3834],{},"Yes",[186,3836,3834],{},[186,3838,3834],{},[168,3840,3841,3845,3847,3849,3851],{},[186,3842,3843,3735],{},[25,3844,2063],{},[186,3846,3831],{},[186,3848,3834],{},[186,3850,3834],{},[186,3852,3834],{},[168,3854,3855,3859,3861,3863,3865],{},[186,3856,3857,3735],{},[25,3858,3389],{},[186,3860,3831],{},[186,3862,3831],{},[186,3864,3831],{},[186,3866,3834],{},[168,3868,3869,3872,3874,3877,3879],{},[186,3870,3871],{},"Trailing commas",[186,3873,3831],{},[186,3875,3876],{},"Depends on the parser",[186,3878,3834],{},[186,3880,3881],{},"Not applicable — commas are optional",[168,3883,3884,3887,3889,3891,3893],{},[186,3885,3886],{},"Unquoted keys",[186,3888,3831],{},[186,3890,3831],{},[186,3892,3834],{},[186,3894,3834],{},[168,3896,3897,3899,3901,3903,3905],{},[186,3898,2867],{},[186,3900,3831],{},[186,3902,3831],{},[186,3904,3834],{},[186,3906,3834],{},[168,3908,3909,3912,3914,3916,3918],{},[186,3910,3911],{},"Extra number forms",[186,3913,3831],{},[186,3915,3831],{},[186,3917,3834],{},[186,3919,3920],{},"Limited",[168,3922,3923,3926,3929,3932,3940],{},[186,3924,3925],{},"Specification",[186,3927,3928],{},"RFC 8259 \u002F ECMA-404",[186,3930,3931],{},"De facto convention",[186,3933,3934,3939],{},[57,3935,3938],{"href":3936,"rel":3937},"https:\u002F\u002Fjson5.org\u002F",[81],"json5.org"," spec",[186,3941,3942,3939],{},[57,3943,3946],{"href":3944,"rel":3945},"https:\u002F\u002Fhjson.github.io\u002F",[81],"hjson.github.io",[168,3948,3949,3952,3955,3958,3961],{},[186,3950,3951],{},"Main goal",[186,3953,3954],{},"Data interchange",[186,3956,3957],{},"Config with comments",[186,3959,3960],{},"Human-friendly config",[186,3962,3960],{},[168,3964,3965,3968,3971,3974,3977],{},[186,3966,3967],{},"Typical use",[186,3969,3970],{},"APIs, data files",[186,3972,3973],{},"Editor configs",[186,3975,3976],{},"Hand-written configs",[186,3978,3979],{},"Niche configs",[28,3981,3982,3985],{},[32,3983,3984],{},"Rule of thumb:"," if you only need comments, use JSONC. It keeps the file one comment-strip away from strict JSON. Reach for JSON5 when you also want a JavaScript-like syntax, and HJSON only when its specific readability rules are what you want.",[71,3987,3989],{"id":3988},"why-vs-codes-settingsjson-allows-comments","Why VS Code's settings.json allows comments",[28,3991,3992,3993,3996],{},"Open VS Code's ",[25,3994,3995],{},"settings.json"," and comments work fine:",[17,3998,4001],{"className":3999,"code":4000,"language":3428,"meta":23},[3426],"\u002F\u002F settings.json — this file is JSONC, not strict JSON\n{\n  \"editor.fontSize\": 14,\n  \u002F\u002F The minimap is distracting on wide screens\n  \"editor.minimap.enabled\": false\n}\n",[25,4002,4000],{"__ignoreMap":23},[28,4004,4005,4006,265,4008,4011,4012,4015,4016,4018],{},"The file is not being read as strict JSON. VS Code treats ",[25,4007,3995],{},[25,4009,4010],{},"keybindings.json",", and similar files as ",[32,4013,4014],{},"JSON with comments",", and its JSON language service parses them in a mode that allows comments. TypeScript does the same for ",[25,4017,2305],{},", which is why comments and trailing commas are accepted there too.",[28,4020,4021,4022,4024],{},"The confusing part is naming: the extension is ",[25,4023,2243],{},", the docs say \"JSON\", and comments still work — because the consumer opted into a superset. Copy that same content into a strict parser and it fails immediately.",[28,4026,4027,4028,4031],{},"This is the general pattern: ",[32,4029,4030],{},"comments are a property of the reader, not of the file."," A file with comments parses only when the tool on the other end agreed to accept them.",[71,4033,4035],{"id":4034},"converting-jsonc-to-json-why-a-regex-is-not-enough","Converting JSONC to JSON: why a regex is not enough",[28,4037,4038,4039,4041,4042,953,4045,69],{},"Eventually a JSONC file has to become strict JSON — a CI tool that rejects comments, an API request body, or a library that only accepts ",[25,4040,2285],{},". The tempting one-liner is a regular expression that deletes ",[25,4043,4044],{},"\u002F\u002F…",[25,4046,4047],{},"\u002F*…*\u002F",[28,4049,4050],{},"It works until it doesn't:",[17,4052,4055],{"className":4053,"code":4054,"language":3428,"meta":23},[3426],"{\n  \"url\": \"https:\u002F\u002Fexample.com\u002F\u002Fassets\",\n  \"pattern\": \"\u002F* match everything *\u002F\",\n  \"note\": \"Use \u002F\u002F for comments in code, never in JSON\"\n}\n",[25,4056,4054],{"__ignoreMap":23},[28,4058,4059,4060,4062,4063,4066,4067,4070],{},"A regex that removes ",[25,4061,2060],{}," to end of line turns the URL into ",[25,4064,4065],{},"\"https:\u002F\u002Fexample.com\""," and empties the note. A regex that removes ",[25,4068,4069],{},"\u002F* … *\u002F"," destroys the pattern. The output is silently wrong, and it may still parse — which makes it worse than an error.",[28,4072,4073,4074,4077],{},"The root problem: ",[32,4075,4076],{},"comment markers and string content can be the same characters."," Only a scanner that tracks whether it is inside a quoted string can tell them apart.",[28,4079,4080],{},"The safe procedure is:",[530,4082,4083,4086,4093,4096],{},[138,4084,4085],{},"Walk the input character by character (or parse it into an AST), copying quoted strings verbatim.",[138,4087,4088,4089,223,4091,69],{},"Drop comment tokens and, if you want them gone, trailing commas before ",[25,4090,41],{},[25,4092,268],{},[138,4094,4095],{},"Parse the cleaned text with a strict JSON parser to confirm the result is valid.",[138,4097,4098],{},"Report a line and column for anything that is not valid.",[71,4100,4102],{"id":4101},"practical-options-for-working-with-json-with-comments","Practical options for working with JSON with comments",[105,4104,4106],{"id":4105},"_1-parse-jsonc-directly-in-your-own-code","1. Parse JSONC directly in your own code",[28,4108,4109],{},"If you control the runtime, the cleanest fix is to let the reader accept comments, and keep comments in the source file:",[17,4111,4114],{"className":4112,"code":4113,"language":94,"meta":23},[92],"import { parse } from 'jsonc-parser'\n\n\u002F\u002F Throws on JSONC syntax errors, returns a normal JS object otherwise.\nconst config = parse(await fs.readFile('config.jsonc', 'utf8'))\n",[25,4115,4113],{"__ignoreMap":23},[17,4117,4120],{"className":4118,"code":4119,"language":2987,"meta":23},[2992],"import json5\n\nwith open(\"config.json5\", \"r\", encoding=\"utf-8\") as f:\n    config = json5.load(f)\n",[25,4121,4119],{"__ignoreMap":23},[28,4123,4124],{},"Best for configs that humans edit and your own application consumes.",[105,4126,4128],{"id":4127},"_2-strip-comments-as-a-build-step","2. Strip comments as a build step",[28,4130,4131,4132,4134],{},"Keep JSONC in the repository and emit ",[25,4133,2243],{}," during the build, so the runtime never sees comments:",[17,4136,4139],{"className":4137,"code":4138,"language":1951,"meta":23},[1949],"npm install --save-dev strip-json-comments\n",[25,4140,4138],{"__ignoreMap":23},[28,4142,4143],{},"Then convert before packaging or deploying. Developers get comments; deployments get strict JSON. This is the most robust setup for pipelines with mixed tooling.",[105,4145,4147],{"id":4146},"_3-convert-jsonc-to-json-in-your-browser","3. Convert JSONC to JSON in your browser",[28,4149,4150,4151,4153,4154,265,4157,287,4159,4161],{},"For one-off conversions, use the ",[57,4152,3207],{"href":1899},". Paste JSONC or open a ",[25,4155,4156],{},".jsonc",[25,4158,2243],{},[25,4160,2250],{}," file, and it produces standard JSON.",[28,4163,4164],{},"What it does:",[135,4166,4167,4181,4191,4194,4197],{},[138,4168,4169,4170,4172,4173,4175,4176,223,4178,4180],{},"Removes ",[25,4171,2060],{}," line comments, ",[25,4174,2063],{}," block comments, and trailing commas before ",[25,4177,41],{},[25,4179,268],{},". Each has its own checkbox, and all three are on by default.",[138,4182,4183,4184,4186,4187,4190],{},"Scans the input character by character and copies quoted strings verbatim, so ",[25,4185,2060],{}," inside ",[25,4188,4189],{},"\"https:\u002F\u002Fexample.com\u002Fa\u002F\u002Fb\""," survives.",[138,4192,4193],{},"Parses the cleaned result as strict JSON and reports the line and column of any error, including unclosed block comments and commas with no value before them.",[138,4195,4196],{},"Shows how many comments and trailing commas were removed.",[138,4198,4199,4200,69],{},"Outputs JSON with two-space, four-space, or minified indentation; you can copy the result or download it as ",[25,4201,2243],{},[28,4203,4204,4205,4207],{},"What it does ",[32,4206,333],{}," do:",[135,4209,4210,4221,4227,4236],{},[138,4211,4212,4215,4216,638,4218,4220],{},[32,4213,4214],{},"It does not parse JSON5."," Unquoted keys, single-quoted strings, hexadecimal numbers, ",[25,4217,686],{},[25,4219,2705],{}," are reported as syntax errors.",[138,4222,4223,4226],{},[32,4224,4225],{},"It does not preserve comments."," Standard JSON has no comment syntax, so no tool can keep them in the output. Keep your original file.",[138,4228,4229,4232,4233,4235],{},[32,4230,4231],{},"It does not validate configuration schemas."," Converting a ",[25,4234,2305],{}," checks JSON syntax only — not TypeScript, ESLint, or Webpack semantics.",[138,4237,4238,4241],{},[32,4239,4240],{},"It is not tuned for very large files."," Rendering depends on browser memory and size; for huge files, a local parser or a build-time conversion is a better fit.",[28,4243,4244],{},"Like every tool on this site, the conversion runs in your browser; the tool does not upload your JSONC.",[105,4246,4248],{"id":4247},"_4-consider-yaml-or-toml-for-comment-heavy-config","4. Consider YAML or TOML for comment-heavy config",[28,4250,4251],{},"If a file needs extensive explanation, multi-line strings, or anchors and references, JSON is the wrong container.",[135,4253,4254,4263],{},[138,4255,4256,4259,4260,4262],{},[32,4257,4258],{},"YAML"," is the default for CI pipelines, Kubernetes manifests, and many deployment tools, and its ",[25,4261,3389],{}," comments are first-class.",[138,4264,4265,4268],{},[32,4266,4267],{},"TOML"," is designed for hand-edited config and reads clearly, with comments throughout.",[28,4270,4271,4272,4276],{},"Keep JSON for data interchange and APIs, and use YAML or TOML where humans are the primary audience. When you do need to move between them, the ",[57,4273,4275],{"href":4274},"\u002Ftools\u002Fconvert\u002Fjson-to-yaml","JSON to YAML Converter"," handles the JSON-to-YAML direction.",[71,4278,801],{"id":800},[105,4280,4282],{"id":4281},"can-you-make-comments-outside-the-brackets-in-json","Can you make comments outside the brackets in JSON?",[28,4284,4285,4286,4288,4289,4291,4292,265,4294,287,4296,4298],{},"No. Standard JSON has no comment syntax anywhere in a document — before the top-level ",[25,4287,278],{},", inside it, or after the closing ",[25,4290,41],{},". Any ",[25,4293,2060],{},[25,4295,2063],{},[25,4297,3389],{}," makes the file invalid JSON.",[105,4300,4302],{"id":4301},"is-jsonc-valid-json","Is JSONC valid JSON?",[28,4304,4305],{},"Strictly, no. All valid JSON is valid JSONC, but JSONC that actually contains comments is not valid JSON under RFC 8259. Tools that advertise JSONC support have opted into a superset.",[105,4307,4309],{"id":4308},"how-do-i-remove-comments-from-a-json-file","How do I remove comments from a JSON file?",[28,4311,4312,4313,223,4316,4319,4320,4322],{},"Use a parser that understands JSONC rather than a search-and-replace. In a build pipeline, ",[25,4314,4315],{},"strip-json-comments",[25,4317,4318],{},"jsonc-parser"," will do it. For a one-off file, paste it into the ",[57,4321,3207],{"href":1899},", which removes comments and trailing commas while leaving string content intact, then validates the result.",[28,4324,4325],{},"Avoid regex-based stripping on files you did not write. Corrupting a URL or a pattern silently is worse than an error you can see.",[105,4327,4329,4330,4332],{"id":4328},"can-i-use-_comment-keys-in-production-json","Can I use ",[25,4331,3200],{}," keys in production JSON?",[28,4334,4335,4336,4338,4339,4341],{},"Yes — they are ordinary keys, so the file stays valid. Just make sure consumers ignore them, that they do not leak into responses or logs where they are noise, and that any schema validation accounts for them. With ",[25,4337,3629],{},", an undeclared ",[25,4340,3200],{}," key is rejected.",[105,4343,4345],{"id":4344},"should-i-use-jsonc-or-json5","Should I use JSONC or JSON5?",[28,4347,1842,4348,4350,4351,4353],{},[32,4349,3697],{}," if comments are the only thing you need. It stays close to strict JSON, so a comment strip is all that separates your file from something any parser accepts. Use ",[32,4352,3725],{}," when you also want unquoted keys, trailing commas, and single-quoted strings in hand-written files.",[105,4355,4357],{"id":4356},"will-removing-comments-break-my-configuration","Will removing comments break my configuration?",[28,4359,4360],{},"Removing comments does not change the values a parser reads, but it does remove information humans need. Keep the original JSONC file and generate strict JSON only where it is required — a CI step, an API call, or a consumer that rejects comments.",[105,4362,4364],{"id":4363},"why-does-my-api-reject-json-with-comments-while-my-editor-accepts-it","Why does my API reject JSON with comments while my editor accepts it?",[28,4366,4367,4368,953,4370,4372,4373,4375],{},"Because they are different readers. Editors such as VS Code parse ",[25,4369,3995],{},[25,4371,2305],{}," as JSONC. An API that declares ",[25,4374,2285],{}," is almost always using a strict parser, which rejects comments by design. This applies to request bodies too: never send commented JSON to an endpoint that expects JSON.",[71,4377,916],{"id":915},[135,4379,4380,4388,4396,4404,4411],{},[138,4381,4382,4385,4386,69],{},[32,4383,4384],{},"Have a JSONC file to clean up?"," Strip comments, block comments, and trailing commas with the ",[57,4387,3207],{"href":1899},[138,4389,4390,4393,4394,69],{},[32,4391,4392],{},"Working with standard JSON?"," Format, validate, and minify it in the ",[57,4395,714],{"href":713},[138,4397,4398,4401,4402,69],{},[32,4399,4400],{},"Config needs more than comments?"," Convert to YAML with the ",[57,4403,4275],{"href":4274},[138,4405,4406,940,4409,69],{},[32,4407,4408],{},"Still hitting parse errors?",[57,4410,68],{"href":67},[138,4412,4413,948,4416,4420],{},[32,4414,4415],{},"Designing an API?",[57,4417,4419],{"href":4418},"\u002Fblog\u002Fjson-best-practices","JSON Best Practices in Real Projects"," for response structure, validation, and security.",[2172,4422],{},[28,4424,4425],{},[113,4426,2178],{},{"title":23,"searchDepth":959,"depth":959,"links":4428},[4429,4430,4431,4432,4436,4442,4443,4444,4450,4460],{"id":3393,"depth":959,"text":3394},{"id":3444,"depth":959,"text":3445},{"id":3478,"depth":959,"text":3479},{"id":3562,"depth":959,"text":3563,"children":4433},[4434,4435],{"id":3569,"depth":964,"text":3570},{"id":3632,"depth":964,"text":3633},{"id":3684,"depth":959,"text":3685,"children":4437},[4438,4439,4440,4441],{"id":3691,"depth":964,"text":3692},{"id":3719,"depth":964,"text":3720},{"id":3771,"depth":964,"text":3772},{"id":3801,"depth":964,"text":3802},{"id":3988,"depth":959,"text":3989},{"id":4034,"depth":959,"text":4035},{"id":4101,"depth":959,"text":4102,"children":4445},[4446,4447,4448,4449],{"id":4105,"depth":964,"text":4106},{"id":4127,"depth":964,"text":4128},{"id":4146,"depth":964,"text":4147},{"id":4247,"depth":964,"text":4248},{"id":800,"depth":959,"text":801,"children":4451},[4452,4453,4454,4455,4457,4458,4459],{"id":4281,"depth":964,"text":4282},{"id":4301,"depth":964,"text":4302},{"id":4308,"depth":964,"text":4309},{"id":4328,"depth":964,"text":4456},"Can I use _comment keys in production JSON?",{"id":4344,"depth":964,"text":4345},{"id":4356,"depth":964,"text":4357},{"id":4363,"depth":964,"text":4364},{"id":915,"depth":959,"text":916},"2026-09-29T00:00:00.000Z","JSON doesn't allow comments. Learn why, plus safe workarounds: JSONC, JSON5, `_comment` keys, and converting JSONC to standard JSON in your browser.","\u002Fblog\u002Fcover\u002Fen\u002Fjson-comments-cover.svg",[998],{},"\u002Fen\u002Fblog\u002Fjson-comments",{"slug":4468,"text":4469,"btn":4470},"jsonc-to-json","Need to strip comments from a JSONC file?","Open JSONC to JSON Converter",{"title":3361,"description":4462},"en\u002Fblog\u002Fjson-comments",[1009,3697,3725,4474,4475],"Configuration","Best Practices","jOTiT98JeRCxwOVLoAepb9wILWSI_h9ezwPpviW_ZE0",{"id":4478,"title":4479,"author":7,"body":4480,"category":991,"date":5528,"description":5529,"draft":994,"extension":995,"h1":5530,"image":5531,"lastmod":5528,"locales":5532,"meta":5534,"navigation":1000,"path":5535,"promo":5536,"seo":5538,"stem":5539,"tags":5540,"__hash__":5545},"blog\u002Fen\u002Fblog\u002Ffree-realistic-json-test-data.md","Free Realistic JSON Test Data for Development and Performance Testing",{"type":9,"value":4481,"toc":5497},[4482,4485,4488,4491,4494,4498,4501,4584,4587,4590,4620,4623,4629,4632,4635,4638,4661,4664,4684,4688,4691,4721,4724,4762,4765,4769,4772,4802,4805,4834,4837,4841,4844,4874,4877,4906,4909,4913,4916,4946,4949,4975,4978,4982,4985,4992,4995,5044,5047,5051,5054,5058,5061,5087,5091,5094,5117,5121,5124,5147,5151,5154,5174,5178,5181,5227,5230,5234,5237,5240,5263,5266,5269,5273,5276,5279,5285,5288,5292,5295,5298,5304,5307,5310,5402,5405,5412,5416,5419,5425,5428,5432,5436,5439,5443,5446,5450,5453,5457,5466,5470,5473,5477,5480,5484,5487,5490],[28,4483,4484],{},"Small JSON examples are useful for learning the syntax, but they are not enough for testing real-world applications.",[28,4486,4487],{},"A production JSON document may contain nested objects, arrays, optional fields, timestamps, image URLs, colors, metadata, user profiles, payment details, inventory records, and error information. Large JSON files can also expose performance problems in parsers, editors, viewers, search features, and virtualized rendering components.",[28,4489,4490],{},"To make testing easier, JsonToolBox provides a collection of free, realistic JSON test datasets for developers, testers, students, and technical writers.",[28,4492,4493],{},"These datasets are synthetically generated and can be downloaded directly for local development, UI testing, JSON parsing, and performance benchmarking.",[71,4495,4497],{"id":4496},"download-json-test-data","Download JSON Test Data",[28,4499,4500],{},"The collection includes several common business scenarios:",[162,4502,4503,4516],{},[165,4504,4505],{},[168,4506,4507,4510,4513],{},[171,4508,4509],{},"Dataset",[171,4511,4512],{},"Description",[171,4514,4515],{},"Useful for testing",[181,4517,4518,4529,4540,4551,4562,4573],{},[168,4519,4520,4523,4526],{},[186,4521,4522],{},"Orders",[186,4524,4525],{},"E-commerce orders, customers, products, taxes, and discounts",[186,4527,4528],{},"Nested objects, arrays, totals, and relationships",[168,4530,4531,4534,4537],{},[186,4532,4533],{},"Users",[186,4535,4536],{},"User profiles, addresses, preferences, companies, and social links",[186,4538,4539],{},"Optional fields, metadata, avatars, and user interfaces",[168,4541,4542,4545,4548],{},[186,4543,4544],{},"Logs",[186,4546,4547],{},"Application and API logs with errors, requests, and timestamps",[186,4549,4550],{},"Wide objects, log levels, error fields, and search",[168,4552,4553,4556,4559],{},[186,4554,4555],{},"Issues",[186,4557,4558],{},"Jira-like project issues with worklogs and custom fields",[186,4560,4561],{},"Deep nesting, dynamic fields, users, and status values",[168,4563,4564,4567,4570],{},[186,4565,4566],{},"Payments",[186,4568,4569],{},"Stripe-like charges, payment intents, customers, and payouts",[186,4571,4572],{},"Payment states, IDs, amounts, and nested resources",[168,4574,4575,4578,4581],{},[186,4576,4577],{},"Products",[186,4579,4580],{},"E-commerce products with variants, inventory, options, and images",[186,4582,4583],{},"Arrays, product variants, images, and inventory data",[105,4585,4522],{"id":4586},"orders",[28,4588,4589],{},"E-commerce order data includes customers, addresses, line items, product images, taxes, discounts, payment states, fulfillment states, and order metadata.",[135,4591,4592,4599,4606,4613],{},[138,4593,4594],{},[57,4595,4598],{"href":4596,"rel":4597},"https:\u002F\u002Fresources.jsontoolbox.cc\u002Forders-1mb.json",[81],"Download Orders — 1 MB",[138,4600,4601],{},[57,4602,4605],{"href":4603,"rel":4604},"https:\u002F\u002Fresources.jsontoolbox.cc\u002Forders-5mb.json",[81],"Download Orders — 5 MB",[138,4607,4608],{},[57,4609,4612],{"href":4610,"rel":4611},"https:\u002F\u002Fresources.jsontoolbox.cc\u002Forders-10mb.json",[81],"Download Orders — 10 MB",[138,4614,4615],{},[57,4616,4619],{"href":4617,"rel":4618},"https:\u002F\u002Fresources.jsontoolbox.cc\u002Forders-20mb.json",[81],"Download Orders — 20 MB",[28,4621,4622],{},"Example structure:",[17,4624,4627],{"className":4625,"code":4626,"language":1354,"meta":23},[1352],"{\n  \"id\": 1001,\n  \"order_number\": \"#1001\",\n  \"created_at\": \"2026-08-12T14:23:45.000Z\",\n  \"customer\": {\n    \"id\": 5021,\n    \"first_name\": \"Alice\",\n    \"last_name\": \"Johnson\",\n    \"email\": \"customer5021@example.com\",\n    \"phone\": \"+1-415-555-3842\"\n  },\n  \"line_items\": [\n    {\n      \"product_id\": 2001,\n      \"title\": \"Premium Wireless Headphones\",\n      \"quantity\": 2,\n      \"price\": \"129.99\",\n      \"image_url\": \"https:\u002F\u002Fpicsum.photos\u002Fseed\u002Fproduct-2001\u002F400\u002F400\",\n      \"variant\": {\n        \"color\": \"#1E293B\",\n        \"size\": \"One Size\"\n      },\n      \"tax_lines\": [\n        { \"title\": \"Tax 8.25%\", \"rate\": 0.0825, \"price\": \"21.45\" }\n      ],\n      \"discount_allocations\": []\n    }\n  ],\n  \"total_price\": \"281.43\",\n  \"subtotal_price\": \"259.98\",\n  \"total_tax\": \"21.45\",\n  \"currency\": \"USD\",\n  \"financial_status\": \"paid\",\n  \"fulfillment_status\": \"fulfilled\",\n  \"tags\": [\"vip\", \"repeat_customer\"],\n  \"metadata\": {\n    \"source\": \"web\",\n    \"campaign\": \"summer_sale_2025\",\n    \"device\": \"desktop\"\n  }\n}\n",[25,4628,4626],{"__ignoreMap":23},[28,4630,4631],{},"This dataset is useful for testing expandable trees, nested arrays, totals, filtering, and order detail interfaces.",[105,4633,4533],{"id":4634},"users",[28,4636,4637],{},"The users dataset contains realistic-looking user profiles with names, emails, avatars, addresses, companies, job titles, preferences, roles, and optional social links.",[135,4639,4640,4647,4654],{},[138,4641,4642],{},[57,4643,4646],{"href":4644,"rel":4645},"https:\u002F\u002Fresources.jsontoolbox.cc\u002Fusers-1mb.json",[81],"Download Users — 1 MB",[138,4648,4649],{},[57,4650,4653],{"href":4651,"rel":4652},"https:\u002F\u002Fresources.jsontoolbox.cc\u002Fusers-15mb.json",[81],"Download Users — 15 MB",[138,4655,4656],{},[57,4657,4660],{"href":4658,"rel":4659},"https:\u002F\u002Fresources.jsontoolbox.cc\u002Fusers-40mb.json",[81],"Download Users — 40 MB",[28,4662,4663],{},"It can be used to test:",[135,4665,4666,4669,4672,4675,4678,4681],{},[138,4667,4668],{},"User management interfaces.",[138,4670,4671],{},"Profile cards and tables.",[138,4673,4674],{},"Avatar and image URL rendering.",[138,4676,4677],{},"Optional and missing fields.",[138,4679,4680],{},"Preferences and nested settings.",[138,4682,4683],{},"Search and filtering by role, language, or status.",[105,4685,4687],{"id":4686},"application-logs","Application Logs",[28,4689,4690],{},"The logs dataset simulates records produced by web applications and backend services.",[135,4692,4693,4700,4707,4714],{},[138,4694,4695],{},[57,4696,4699],{"href":4697,"rel":4698},"https:\u002F\u002Fresources.jsontoolbox.cc\u002Flogs-1mb.json",[81],"Download Logs — 1 MB",[138,4701,4702],{},[57,4703,4706],{"href":4704,"rel":4705},"https:\u002F\u002Fresources.jsontoolbox.cc\u002Flogs-10mb.json",[81],"Download Logs — 10 MB",[138,4708,4709],{},[57,4710,4713],{"href":4711,"rel":4712},"https:\u002F\u002Fresources.jsontoolbox.cc\u002Flogs-30mb.json",[81],"Download Logs — 30 MB",[138,4715,4716],{},[57,4717,4720],{"href":4718,"rel":4719},"https:\u002F\u002Fresources.jsontoolbox.cc\u002Flogs-50mb.json",[81],"Download Logs — 50 MB",[28,4722,4723],{},"Log records may contain:",[135,4725,4726,4744,4747,4750,4753,4756,4759],{},[138,4727,4728,4729,265,4732,265,4735,265,4738,638,4741,69],{},"Log levels such as ",[25,4730,4731],{},"DEBUG",[25,4733,4734],{},"INFO",[25,4736,4737],{},"WARN",[25,4739,4740],{},"ERROR",[25,4742,4743],{},"FATAL",[138,4745,4746],{},"Request IDs and user IDs.",[138,4748,4749],{},"HTTP methods and status codes.",[138,4751,4752],{},"API paths and query parameters.",[138,4754,4755],{},"Processing durations.",[138,4757,4758],{},"Error messages and stack traces.",[138,4760,4761],{},"Service, host, region, and environment metadata.",[28,4763,4764],{},"This makes the dataset suitable for testing log viewers, JSON search, syntax highlighting, error filtering, and wide-record rendering.",[105,4766,4768],{"id":4767},"jira-like-issues","Jira-like Issues",[28,4770,4771],{},"The issues dataset simulates project management and issue-tracking records.",[135,4773,4774,4781,4788,4795],{},[138,4775,4776],{},[57,4777,4780],{"href":4778,"rel":4779},"https:\u002F\u002Fresources.jsontoolbox.cc\u002Fissues-1mb.json",[81],"Download Issues — 1 MB",[138,4782,4783],{},[57,4784,4787],{"href":4785,"rel":4786},"https:\u002F\u002Fresources.jsontoolbox.cc\u002Fissues-10mb.json",[81],"Download Issues — 10 MB",[138,4789,4790],{},[57,4791,4794],{"href":4792,"rel":4793},"https:\u002F\u002Fresources.jsontoolbox.cc\u002Fissues-20mb.json",[81],"Download Issues — 20 MB",[138,4796,4797],{},[57,4798,4801],{"href":4799,"rel":4800},"https:\u002F\u002Fresources.jsontoolbox.cc\u002Fissues-40mb.json",[81],"Download Issues — 40 MB",[28,4803,4804],{},"Each issue may include:",[135,4806,4807,4810,4813,4816,4819,4822,4825,4828,4831],{},[138,4808,4809],{},"Project keys and issue identifiers.",[138,4811,4812],{},"Summaries and descriptions.",[138,4814,4815],{},"Issue types, priorities, and statuses.",[138,4817,4818],{},"Reporters and assignees.",[138,4820,4821],{},"Labels and components.",[138,4823,4824],{},"Fix versions.",[138,4826,4827],{},"Worklogs and comments.",[138,4829,4830],{},"Story points and custom fields.",[138,4832,4833],{},"Epic relationships.",[28,4835,4836],{},"This scenario is particularly useful for testing inconsistent object shapes and dynamic fields. Not every issue contains the same optional properties, which better reflects data from real business systems.",[105,4838,4840],{"id":4839},"stripe-like-payments","Stripe-like Payments",[28,4842,4843],{},"The payments dataset represents common payment-related objects such as charges, payment intents, customers, payment methods, and payouts.",[135,4845,4846,4853,4860,4867],{},[138,4847,4848],{},[57,4849,4852],{"href":4850,"rel":4851},"https:\u002F\u002Fresources.jsontoolbox.cc\u002Fpayments-1mb.json",[81],"Download Payments — 1 MB",[138,4854,4855],{},[57,4856,4859],{"href":4857,"rel":4858},"https:\u002F\u002Fresources.jsontoolbox.cc\u002Fpayments-10mb.json",[81],"Download Payments — 10 MB",[138,4861,4862],{},[57,4863,4866],{"href":4864,"rel":4865},"https:\u002F\u002Fresources.jsontoolbox.cc\u002Fpayments-20mb.json",[81],"Download Payments — 20 MB",[138,4868,4869],{},[57,4870,4873],{"href":4871,"rel":4872},"https:\u002F\u002Fresources.jsontoolbox.cc\u002Fpayments-40mb.json",[81],"Download Payments — 40 MB",[28,4875,4876],{},"The generated records may include:",[135,4878,4879,4882,4885,4888,4891,4894,4897,4900,4903],{},[138,4880,4881],{},"Payment IDs and customer IDs.",[138,4883,4884],{},"Amounts represented in cents.",[138,4886,4887],{},"Currency codes.",[138,4889,4890],{},"Card brands and masked card numbers.",[138,4892,4893],{},"Payment status transitions.",[138,4895,4896],{},"Refund amounts.",[138,4898,4899],{},"Failure codes and messages.",[138,4901,4902],{},"Payment metadata.",[138,4904,4905],{},"Payout arrival dates.",[28,4907,4908],{},"All payment records are synthetic. They are not connected to real payment accounts or transactions and must not be used as financial records.",[105,4910,4912],{"id":4911},"e-commerce-products","E-commerce Products",[28,4914,4915],{},"The products dataset contains catalog data with product images, options, variants, prices, inventory, tags, SEO metadata, and publication status.",[135,4917,4918,4925,4932,4939],{},[138,4919,4920],{},[57,4921,4924],{"href":4922,"rel":4923},"https:\u002F\u002Fresources.jsontoolbox.cc\u002Fproducts-1mb.json",[81],"Download Products — 1 MB",[138,4926,4927],{},[57,4928,4931],{"href":4929,"rel":4930},"https:\u002F\u002Fresources.jsontoolbox.cc\u002Fproducts-10mb.json",[81],"Download Products — 10 MB",[138,4933,4934],{},[57,4935,4938],{"href":4936,"rel":4937},"https:\u002F\u002Fresources.jsontoolbox.cc\u002Fproducts-20mb.json",[81],"Download Products — 20 MB",[138,4940,4941],{},[57,4942,4945],{"href":4943,"rel":4944},"https:\u002F\u002Fresources.jsontoolbox.cc\u002Fproducts-40mb.json",[81],"Download Products — 40 MB",[28,4947,4948],{},"A product may contain:",[135,4950,4951,4954,4957,4960,4963,4966,4969,4972],{},[138,4952,4953],{},"Multiple images with URLs, dimensions, and positions.",[138,4955,4956],{},"Color and size options.",[138,4958,4959],{},"Several product variants with SKUs.",[138,4961,4962],{},"Inventory quantities and availability flags.",[138,4964,4965],{},"Sale prices and comparison prices.",[138,4967,4968],{},"Product tags and categories.",[138,4970,4971],{},"SEO titles and descriptions.",[138,4973,4974],{},"External image URLs from placeholder services.",[28,4976,4977],{},"This dataset is useful for testing product grids, variant selectors, inventory dashboards, catalog imports, and nested JSON structures.",[71,4979,4981],{"id":4980},"test-json-tools-online","Test JSON Tools Online",[28,4983,4984],{},"After downloading a dataset, you can open it with the free JSON tools on JsonToolBox.",[28,4986,1145,4987,4991],{},[57,4988,4990],{"href":4989},"\u002Ftools","JsonToolBox tools page"," provides browser-based tools for working with JSON data. The tools run directly in the browser, so you can format, validate, edit, compare, and convert JSON without uploading it to a server.",[28,4993,4994],{},"Useful tools include:",[135,4996,4997,5002,5009,5016,5023,5030,5037],{},[138,4998,4999,5001],{},[57,5000,714],{"href":713}," for editing, formatting, validating, and exporting JSON.",[138,5003,5004,5008],{},[57,5005,5007],{"href":5006},"\u002Ftools\u002Fconvert\u002Fjson-to-csv","JSON to CSV Converter"," for converting arrays of objects into CSV files for Excel or Google Sheets.",[138,5010,5011,5015],{},[57,5012,5014],{"href":5013},"\u002Ftools\u002Fconvert\u002Fjson-to-excel","JSON to Excel"," for converting JSON arrays directly to Excel spreadsheets.",[138,5017,5018,5022],{},[57,5019,5021],{"href":5020},"\u002Ftools\u002Fformat\u002Fjson-escape","JSON Escape and Unescape"," for handling quotes, backslashes, newlines, and other special characters.",[138,5024,5025,5029],{},[57,5026,5028],{"href":5027},"\u002Ftools\u002Fformat\u002Fjson-minifier","JSON Minifier"," for compressing JSON by removing whitespace.",[138,5031,5032,5036],{},[57,5033,5035],{"href":5034},"\u002Ftools\u002Fconvert\u002Fjson-compare","JSON Compare"," for highlighting differences between two JSON documents.",[138,5038,5039,5043],{},[57,5040,5042],{"href":5041},"\u002Ftools\u002Fconvert\u002Fjson-to-typescript","JSON to TypeScript"," for generating TypeScript interfaces from JSON data.",[28,5045,5046],{},"JsonToolBox is designed for browser-based JSON workflows. Data can be processed locally in the browser without creating an account or uploading files to a remote service.",[71,5048,5050],{"id":5049},"use-cases","Use Cases",[28,5052,5053],{},"These datasets can be used in many development and testing workflows.",[105,5055,5057],{"id":5056},"testing-json-viewers","Testing JSON viewers",[28,5059,5060],{},"Use the larger files to test:",[135,5062,5063,5066,5069,5072,5075,5078,5081,5084],{},[138,5064,5065],{},"Initial loading time.",[138,5067,5068],{},"Tree expansion and collapse.",[138,5070,5071],{},"Virtualized rendering.",[138,5073,5074],{},"Deeply nested structures.",[138,5076,5077],{},"Large arrays.",[138,5079,5080],{},"Search and filtering.",[138,5082,5083],{},"Memory usage.",[138,5085,5086],{},"Scrolling performance.",[105,5088,5090],{"id":5089},"testing-json-editors","Testing JSON editors",[28,5092,5093],{},"The datasets can help test whether an editor can:",[135,5095,5096,5099,5102,5105,5108,5111,5114],{},[138,5097,5098],{},"Open large documents.",[138,5100,5101],{},"Format and minify JSON.",[138,5103,5104],{},"Highlight syntax errors.",[138,5106,5107],{},"Edit nested values.",[138,5109,5110],{},"Search through large files.",[138,5112,5113],{},"Preserve arrays and object structures.",[138,5115,5116],{},"Export the modified document.",[105,5118,5120],{"id":5119},"testing-apis-and-parsers","Testing APIs and parsers",[28,5122,5123],{},"Developers can use the files as fixtures for:",[135,5125,5126,5129,5132,5135,5138,5141,5144],{},[138,5127,5128],{},"Unit tests.",[138,5130,5131],{},"Integration tests.",[138,5133,5134],{},"Import and export workflows.",[138,5136,5137],{},"Schema validation.",[138,5139,5140],{},"Data transformation.",[138,5142,5143],{},"JSON-to-CSV conversion.",[138,5145,5146],{},"Database seed scripts.",[105,5148,5150],{"id":5149},"building-demos-and-tutorials","Building demos and tutorials",[28,5152,5153],{},"The smaller datasets are suitable for:",[135,5155,5156,5159,5162,5165,5168,5171],{},[138,5157,5158],{},"Documentation examples.",[138,5160,5161],{},"Frontend demos.",[138,5163,5164],{},"Table and tree components.",[138,5166,5167],{},"API response examples.",[138,5169,5170],{},"Data visualization prototypes.",[138,5172,5173],{},"Programming exercises.",[71,5175,5177],{"id":5176},"file-sizes","File Sizes",[28,5179,5180],{},"Different file sizes are useful for different types of testing.",[162,5182,5183,5193],{},[165,5184,5185],{},[168,5186,5187,5190],{},[171,5188,5189],{},"Size",[171,5191,5192],{},"Recommended use",[181,5194,5195,5203,5211,5219],{},[168,5196,5197,5200],{},[186,5198,5199],{},"1 MB",[186,5201,5202],{},"Quick demos, unit tests, and local development",[168,5204,5205,5208],{},[186,5206,5207],{},"5–10 MB",[186,5209,5210],{},"Editor, viewer, and parser testing",[168,5212,5213,5216],{},[186,5214,5215],{},"20–30 MB",[186,5217,5218],{},"Large-file rendering and memory testing",[168,5220,5221,5224],{},[186,5222,5223],{},"40–50 MB",[186,5225,5226],{},"Stress testing and performance benchmarking",[28,5228,5229],{},"The exact number of records depends on the dataset type. Orders, issues, and products usually contain more nested data per record than simple users or logs.",[71,5231,5233],{"id":5232},"synthetic-data-and-privacy","Synthetic Data and Privacy",[28,5235,5236],{},"All records in this collection are generated data. They are not copied from real customers, payment systems, project trackers, or production databases.",[28,5238,5239],{},"The generated data may contain:",[135,5241,5242,5245,5248,5251,5254,5257,5260],{},[138,5243,5244],{},"Fake names.",[138,5246,5247],{},"Example email addresses.",[138,5249,5250],{},"Test phone numbers.",[138,5252,5253],{},"Synthetic addresses.",[138,5255,5256],{},"Random IDs.",[138,5258,5259],{},"Public placeholder image URLs.",[138,5261,5262],{},"Generated colors and metadata.",[28,5264,5265],{},"You should still avoid using these files as real customer data or production fixtures without reviewing them for your specific use case.",[28,5267,5268],{},"The payment datasets are for interface and parser testing only. They do not contain real payment information and cannot be used to process transactions.",[71,5270,5272],{"id":5271},"external-image-urls","External Image URLs",[28,5274,5275],{},"Some records include public image URLs, such as avatar and product image fields. These URLs are useful when testing applications that render remote images.",[28,5277,5278],{},"For example:",[17,5280,5283],{"className":5281,"code":5282,"language":1354,"meta":23},[1352],"{\n  \"avatar_url\": \"https:\u002F\u002Fi.pravatar.cc\u002F300?u=5021\",\n  \"image_url\": \"https:\u002F\u002Fpicsum.photos\u002Fseed\u002Fproduct-2001\u002F400\u002F400\"\n}\n",[25,5284,5282],{"__ignoreMap":23},[28,5286,5287],{},"External image services may apply rate limits or change their availability. If you need stable long-term testing, replace these URLs with images hosted on your own domain or use a local asset version of the dataset.",[71,5289,5291],{"id":5290},"generate-your-own-data","Generate Your Own Data",[28,5293,5294],{},"The downloadable files are useful when you need ready-to-use fixtures. If you need a different size or structure, you can generate your own files with the accompanying Node.js scripts.",[28,5296,5297],{},"The generator supports scenarios such as:",[17,5299,5302],{"className":5300,"code":5301,"language":1951,"meta":23},[1949],"# Clone the repository\ngit clone https:\u002F\u002Fgithub.com\u002Fkbmjj123\u002Fjsontoolbox.cc.git\ncd jsontoolbox.cc\u002Flibs\u002Fjson-generator\n\n# Install tsx if needed\npnpm add -D tsx\n\n# Generate a dataset (default output: .\u002Foutput\u002F)\ntsx scripts\u002Fgenerate.ts orders 10\ntsx scripts\u002Fgenerate.ts users 10\ntsx scripts\u002Fgenerate.ts logs 10\ntsx scripts\u002Fgenerate.ts issues 10\ntsx scripts\u002Fgenerate.ts payments 10\ntsx scripts\u002Fgenerate.ts products 10\n",[25,5303,5301],{"__ignoreMap":23},[28,5305,5306],{},"The first argument selects the dataset type. The second argument is the approximate target size in megabytes.",[28,5308,5309],{},"Each dataset type produces records with different structures and nesting depths:",[162,5311,5312,5325],{},[165,5313,5314],{},[168,5315,5316,5319,5322],{},[171,5317,5318],{},"Type",[171,5320,5321],{},"Avg record size",[171,5323,5324],{},"Key characteristics",[181,5326,5327,5339,5351,5364,5377,5389],{},[168,5328,5329,5333,5336],{},[186,5330,5331],{},[25,5332,4586],{},[186,5334,5335],{},"~1.8 KB",[186,5337,5338],{},"Customer, line items, tax, discounts, shipping",[168,5340,5341,5345,5348],{},[186,5342,5343],{},[25,5344,4634],{},[186,5346,5347],{},"~0.7 KB",[186,5349,5350],{},"Profile, address, preferences, social links",[168,5352,5353,5358,5361],{},[186,5354,5355],{},[25,5356,5357],{},"logs",[186,5359,5360],{},"~0.5 KB",[186,5362,5363],{},"Timestamps, request info, errors, metadata",[168,5365,5366,5371,5374],{},[186,5367,5368],{},[25,5369,5370],{},"issues",[186,5372,5373],{},"~1.5 KB",[186,5375,5376],{},"Worklogs, custom fields, components, labels",[168,5378,5379,5384,5386],{},[186,5380,5381],{},[25,5382,5383],{},"payments",[186,5385,5360],{},[186,5387,5388],{},"Charges, intents, cards, payouts",[168,5390,5391,5396,5399],{},[186,5392,5393],{},[25,5394,5395],{},"products",[186,5397,5398],{},"~2.3 KB",[186,5400,5401],{},"Variants, images, options, inventory, SEO",[28,5403,5404],{},"Source code and generation instructions are available in the JsonToolBox repository:",[28,5406,5407],{},[57,5408,5411],{"href":5409,"rel":5410},"https:\u002F\u002Fgithub.com\u002Fkbmjj123\u002Fjsontoolbox.cc\u002Ftree\u002Fdevelop\u002Flibs\u002Fjson-generator",[81],"View the JSON test data generator on GitHub",[71,5413,5415],{"id":5414},"dataset-manifest","Dataset Manifest",[28,5417,5418],{},"Each release can include a manifest describing the available files:",[17,5420,5423],{"className":5421,"code":5422,"language":1354,"meta":23},[1352],"{\n  \"name\": \"JsonToolBox Realistic JSON Test Data\",\n  \"version\": \"1.0.0\",\n  \"datasets\": [\n    {\n      \"type\": \"orders\",\n      \"file\": \"orders-10mb.json\",\n      \"records\": 6307,\n      \"size_bytes\": 11118080,\n      \"format\": \"pretty\"\n    },\n    {\n      \"type\": \"products\",\n      \"file\": \"products-10mb.json\",\n      \"records\": 3756,\n      \"size_bytes\": 9007104,\n      \"format\": \"pretty\"\n    }\n  ]\n}\n",[25,5424,5422],{"__ignoreMap":23},[28,5426,5427],{},"A manifest makes it easier for documentation, automated tests, download pages, and CI workflows to discover the available datasets.",[71,5429,5431],{"id":5430},"frequently-asked-questions","Frequently Asked Questions",[105,5433,5435],{"id":5434},"are-these-json-files-free","Are these JSON files free?",[28,5437,5438],{},"Yes. The datasets are intended for free use in development, testing, education, and demonstrations.",[105,5440,5442],{"id":5441},"are-the-records-real","Are the records real?",[28,5444,5445],{},"No. The records are synthetically generated and do not represent real users, payments, orders, or projects.",[105,5447,5449],{"id":5448},"can-i-use-these-files-to-test-a-json-viewer","Can I use these files to test a JSON viewer?",[28,5451,5452],{},"Yes. The datasets are designed for JSON viewers, editors, formatters, validators, parsers, importers, and large-file rendering systems.",[105,5454,5456],{"id":5455},"do-the-datasets-contain-images","Do the datasets contain images?",[28,5458,5459,5460,953,5463,69],{},"Some datasets contain image URL fields, including avatars and product images. The URLs point to public placeholder image services like ",[25,5461,5462],{},"pravatar.cc",[25,5464,5465],{},"picsum.photos",[105,5467,5469],{"id":5468},"can-i-generate-larger-files","Can I generate larger files?",[28,5471,5472],{},"Yes. Use the Node.js generator to create files with a custom target size or record count. There is no hard limit — the generator samples a few records to estimate average size, then produces enough records to reach the target.",[105,5474,5476],{"id":5475},"can-i-use-the-data-commercially","Can I use the data commercially?",[28,5478,5479],{},"The generator source code is open source. You can use the generated files in your projects, demos, and documentation. Review the license in the repository for full details.",[71,5481,5483],{"id":5482},"conclusion","Conclusion",[28,5485,5486],{},"Realistic test data makes it easier to test JSON tools under conditions that are closer to real applications.",[28,5488,5489],{},"The JsonToolBox dataset collection includes orders, users, logs, issues, payments, and products with nested structures, arrays, optional fields, metadata, image URLs, timestamps, colors, and business-style relationships.",[28,5491,5492,5493,5496],{},"Download a dataset, open it in ",[57,5494,5495],{"href":713},"JsonToolBox",", and use it to test formatting, validation, editing, conversion, searching, and large-file rendering directly in your browser.",{"title":23,"searchDepth":959,"depth":959,"links":5498},[5499,5507,5508,5514,5515,5516,5517,5518,5519,5527],{"id":4496,"depth":959,"text":4497,"children":5500},[5501,5502,5503,5504,5505,5506],{"id":4586,"depth":964,"text":4522},{"id":4634,"depth":964,"text":4533},{"id":4686,"depth":964,"text":4687},{"id":4767,"depth":964,"text":4768},{"id":4839,"depth":964,"text":4840},{"id":4911,"depth":964,"text":4912},{"id":4980,"depth":959,"text":4981},{"id":5049,"depth":959,"text":5050,"children":5509},[5510,5511,5512,5513],{"id":5056,"depth":964,"text":5057},{"id":5089,"depth":964,"text":5090},{"id":5119,"depth":964,"text":5120},{"id":5149,"depth":964,"text":5150},{"id":5176,"depth":959,"text":5177},{"id":5232,"depth":959,"text":5233},{"id":5271,"depth":959,"text":5272},{"id":5290,"depth":959,"text":5291},{"id":5414,"depth":959,"text":5415},{"id":5430,"depth":959,"text":5431,"children":5520},[5521,5522,5523,5524,5525,5526],{"id":5434,"depth":964,"text":5435},{"id":5441,"depth":964,"text":5442},{"id":5448,"depth":964,"text":5449},{"id":5455,"depth":964,"text":5456},{"id":5468,"depth":964,"text":5469},{"id":5475,"depth":964,"text":5476},{"id":5482,"depth":959,"text":5483},"2026-09-08T00:00:00.000Z","Download free, realistic JSON test datasets — orders, users, logs, issues, payments, and products — for testing JSON viewers, editors, parsers, and performance benchmarks.",null,"\u002Fblog\u002Fcover\u002Fen\u002Ffree-realistic-json-test-data-cover.svg",[998,5533],"zh",{},"\u002Fen\u002Fblog\u002Ffree-realistic-json-test-data",{"slug":2220,"text":5537,"btn":2222},"🚀 Want to open these files right now? Try the JSON Editor:",{"title":4479,"description":5529},"en\u002Fblog\u002Ffree-realistic-json-test-data",[1009,5541,714,5542,5543,5544],"Test Data","Performance Testing","JSON Viewer","Developer Tools","H7s5CgZP9IoDesBhUBEsYbdd2lePZ_u5ZiivdGEYeAw",{"id":5547,"title":3680,"author":7,"body":5548,"category":991,"date":6554,"description":6555,"draft":994,"extension":995,"h1":3680,"image":6556,"lastmod":6554,"locales":6557,"meta":6558,"navigation":1000,"path":6559,"promo":6560,"seo":6564,"stem":6565,"tags":6566,"__hash__":6570},"blog\u002Fen\u002Fblog\u002Fjson-validation-syntax-vs-schema.md",{"type":9,"value":5549,"toc":6506},[5550,5553,5556,5561,5564,5568,5575,5581,5587,5619,5622,5626,5631,5635,5640,5669,5676,5680,5683,5689,5696,5702,5705,5732,5736,5746,5754,5763,5767,5774,5778,5781,5785,5791,5810,5813,5817,5828,5834,5838,5935,5938,5980,5987,6010,6014,6020,6025,6028,6119,6125,6129,6132,6136,6179,6182,6186,6189,6200,6204,6210,6214,6220,6230,6234,6240,6244,6250,6253,6257,6260,6264,6270,6274,6280,6284,6290,6293,6297,6301,6306,6310,6316,6320,6326,6330,6344,6348,6351,6355,6358,6362,6365,6406,6408,6412,6422,6426,6435,6439,6442,6449,6458,6460,6500,6502],[12,5551,3680],{"id":5552},"json-validation-explained-syntax-checks-vs-json-schema-validation",[28,5554,5555],{},"A JSON string can be parsed without errors and still break your API.",[28,5557,5558,5560],{},[25,5559,84],{}," only checks whether text follows JSON grammar. It does not check whether required fields exist, whether values match expected types, or whether extra fields should be rejected. For that, you need schema validation and, beyond that, business-rule validation.",[28,5562,5563],{},"This guide explains the three layers of JSON validation and shows how to implement each one in JavaScript.",[71,5565,5567],{"id":5566},"the-short-answer-valid-json-is-not-always-valid-data","The Short Answer: Valid JSON Is Not Always Valid Data",[28,5569,5570,5571,5574],{},"Consider this payload sent to a ",[25,5572,5573],{},"POST \u002Fusers"," endpoint:",[17,5576,5579],{"className":5577,"code":5578,"language":1354,"meta":23},[1352],"{\n  \"email\": \"not-an-email\",\n  \"age\": -3,\n  \"role\": \"superadmin\",\n  \"marketingOptIn\": \"yes\",\n  \"debug\": true\n}\n",[25,5580,5578],{"__ignoreMap":23},[28,5582,5583,5584,5586],{},"This is valid JSON — ",[25,5585,84],{}," will succeed. But the data violates nearly every rule your API should enforce:",[135,5588,5589,5595,5601,5607,5613],{},[138,5590,5591,5594],{},[25,5592,5593],{},"email"," is not a valid email address.",[138,5596,5597,5600],{},[25,5598,5599],{},"age"," is negative.",[138,5602,5603,5606],{},[25,5604,5605],{},"role"," is not one of the allowed values.",[138,5608,5609,5612],{},[25,5610,5611],{},"marketingOptIn"," should be a boolean, not a string.",[138,5614,5615,5618],{},[25,5616,5617],{},"debug"," is an unknown field that should not be accepted.",[28,5620,5621],{},"This is why validation must go beyond syntax.",[71,5623,5625],{"id":5624},"layer-1-syntax-validation-can-the-text-be-parsed","Layer 1: Syntax Validation — Can the Text Be Parsed?",[28,5627,5628,5629,69],{},"Syntax validation checks whether a string conforms to the JSON grammar defined in RFC 8259. The simplest way to perform it in JavaScript is ",[25,5630,84],{},[105,5632,5634],{"id":5633},"what-jsonparse-checks","What JSON.parse() checks",[28,5636,5637,5639],{},[25,5638,84],{}," verifies that the text is structurally valid JSON:",[135,5641,5642,5651,5654,5657,5660,5663],{},[138,5643,5644,5645,542,5647,5650],{},"Strings use double quotes (",[25,5646,272],{},[25,5648,5649],{},"'",").",[138,5652,5653],{},"Keys are double-quoted.",[138,5655,5656],{},"No trailing commas.",[138,5658,5659],{},"No comments.",[138,5661,5662],{},"Brackets and braces are balanced.",[138,5664,5665,5666,5668],{},"Numbers, booleans, and ",[25,5667,337],{}," are in correct form.",[28,5670,5671,5672,5675],{},"If any of these rules are violated, JavaScript throws a ",[25,5673,5674],{},"SyntaxError",". Common problems include trailing commas from JavaScript object literals, single-quoted strings, and unquoted keys.",[105,5677,5679],{"id":5678},"common-syntax-errors","Common syntax errors",[28,5681,5682],{},"This JSON looks reasonable but fails to parse:",[17,5684,5687],{"className":5685,"code":5686,"language":1354,"meta":23},[1352],"{\n  \"email\": \"ada@example.com\",\n  \"age\": 36,\n}\n",[25,5688,5686],{"__ignoreMap":23},[28,5690,5691,5692,5695],{},"The trailing comma after ",[25,5693,5694],{},"36"," makes it invalid. Fix:",[17,5697,5700],{"className":5698,"code":5699,"language":1354,"meta":23},[1352],"{\n  \"email\": \"ada@example.com\",\n  \"age\": 36\n}\n",[25,5701,5699],{"__ignoreMap":23},[28,5703,5704],{},"Other frequent mistakes:",[135,5706,5707,5714,5720,5726],{},[138,5708,5709,5710,5713],{},"Single quotes instead of double quotes: ",[25,5711,5712],{},"{ 'name': 'Ada' }"," → invalid.",[138,5715,5716,5717,5713],{},"Comments: ",[25,5718,5719],{},"{ \"name\": \"Ada\" \u002F\u002F developer note }",[138,5721,5722,5723,5725],{},"Unquoted keys: ",[25,5724,2630],{}," → invalid in JSON (valid in JavaScript object literals).",[138,5727,5728,5729,5713],{},"Unclosed brackets: ",[25,5730,5731],{},"{ \"items\": [1, 2, 3",[105,5733,5735],{"id":5734},"a-safe-syntax-check-helper","A safe syntax-check helper",[28,5737,5738,5739,5741,5742,5745],{},"Instead of wrapping ",[25,5740,84],{}," in a bare ",[25,5743,5744],{},"try\u002Fcatch",", return a structured result so callers can display meaningful error messages:",[17,5747,5752],{"className":5748,"code":5750,"language":5751,"meta":23},[5749],"language-ts","export type JsonSyntaxResult =\n  | { valid: true; value: unknown }\n  | { valid: false; error: string }\n\nexport function parseJsonSafely(text: string): JsonSyntaxResult {\n  try {\n    return { valid: true, value: JSON.parse(text) }\n  } catch (error) {\n    return {\n      valid: false,\n      error: error instanceof Error ? error.message : 'Invalid JSON',\n    }\n  }\n}\n","ts",[25,5753,5750],{"__ignoreMap":23},[28,5755,5756,5757,5759,5760,69],{},"This only verifies JSON syntax. It does not verify required fields, types, allowed values, or application rules. If ",[25,5758,84],{}," throws before you can inspect the data, start with our guide to ",[57,5761,5762],{"href":67},"debugging common JSON parse errors in API responses",[105,5764,5766],{"id":5765},"when-to-use-an-online-json-validator","When to use an online JSON Validator",[28,5768,5769,5770,5773],{},"For quick checks during development or when reviewing API responses from logs, paste the raw text into a ",[57,5771,5772],{"href":713},"JSON syntax validator"," to see whether it parses and where errors occur. This is especially useful when the JSON is minified or comes from an unfamiliar source.",[71,5775,5777],{"id":5776},"layer-2-schema-validation-does-the-data-have-the-expected-shape","Layer 2: Schema Validation — Does the Data Have the Expected Shape?",[28,5779,5780],{},"Syntax validation tells you the text is JSON. Schema validation tells you the data matches the structure your application expects.",[105,5782,5784],{"id":5783},"what-json-schema-validates","What JSON Schema validates",[28,5786,5787,5790],{},[57,5788,3676],{"href":3674,"rel":5789},[81]," is a declarative vocabulary for describing the structure, constraints, and data types of JSON documents. A schema can specify:",[135,5792,5793,5798,5801,5804,5807],{},[138,5794,5795,5796,69],{},"The expected type: object, array, string, number, boolean, or ",[25,5797,337],{},[138,5799,5800],{},"Which fields are required.",[138,5802,5803],{},"Allowed values for each field.",[138,5805,5806],{},"Numeric ranges, string patterns, and array lengths.",[138,5808,5809],{},"Whether extra fields are permitted.",[28,5811,5812],{},"The schema is itself a JSON document, which makes it portable across languages and tools.",[105,5814,5816],{"id":5815},"the-user-creation-schema","The user creation schema",[28,5818,5819,5820,5822,5823,290],{},"Here is a JSON Schema for the ",[25,5821,5573],{}," payload. It uses ",[57,5824,5827],{"href":5825,"rel":5826},"https:\u002F\u002Fjson-schema.org\u002Fdraft\u002F2020-12\u002Fschema",[81],"Draft 2020-12",[17,5829,5832],{"className":5830,"code":5831,"language":1354,"meta":23},[1352],"{\n  \"$schema\": \"https:\u002F\u002Fjson-schema.org\u002Fdraft\u002F2020-12\u002Fschema\",\n  \"type\": \"object\",\n  \"additionalProperties\": false,\n  \"required\": [\"email\", \"age\", \"role\", \"marketingOptIn\"],\n  \"properties\": {\n    \"email\": {\n      \"type\": \"string\",\n      \"format\": \"email\"\n    },\n    \"age\": {\n      \"type\": \"integer\",\n      \"minimum\": 0,\n      \"maximum\": 150\n    },\n    \"role\": {\n      \"type\": \"string\",\n      \"enum\": [\"user\", \"editor\", \"admin\"]\n    },\n    \"marketingOptIn\": {\n      \"type\": \"boolean\"\n    }\n  }\n}\n",[25,5833,5831],{"__ignoreMap":23},[105,5835,5837],{"id":5836},"how-to-read-this-schema","How to read this schema",[162,5839,5840,5850],{},[165,5841,5842],{},[168,5843,5844,5847],{},[171,5845,5846],{},"Keyword",[171,5848,5849],{},"What it enforces",[181,5851,5852,5862,5872,5882,5892,5908,5921],{},[168,5853,5854,5859],{},[186,5855,5856],{},[25,5857,5858],{},"type: \"object\"",[186,5860,5861],{},"The root value must be a JSON object.",[168,5863,5864,5869],{},[186,5865,5866],{},[25,5867,5868],{},"required",[186,5870,5871],{},"These fields must be present.",[168,5873,5874,5879],{},[186,5875,5876],{},[25,5877,5878],{},"properties",[186,5880,5881],{},"Defines the expected shape for each field.",[168,5883,5884,5889],{},[186,5885,5886],{},[25,5887,5888],{},"format: \"email\"",[186,5890,5891],{},"Declares the expected format. Enforcement depends on the validator (see below).",[168,5893,5894,5903],{},[186,5895,5896,5899,5900],{},[25,5897,5898],{},"minimum"," \u002F ",[25,5901,5902],{},"maximum",[186,5904,5905,5906,69],{},"Numeric boundaries for ",[25,5907,5599],{},[168,5909,5910,5915],{},[186,5911,5912],{},[25,5913,5914],{},"enum",[186,5916,5917,5918,5920],{},"Restricts ",[25,5919,5605],{}," to the listed values.",[168,5922,5923,5927],{},[186,5924,5925],{},[25,5926,3629],{},[186,5928,5929,5930,223,5932,69],{},"Rejects any field not declared in ",[25,5931,5878],{},[25,5933,5934],{},"patternProperties",[28,5936,5937],{},"Two details that often cause confusion:",[530,5939,5940,5960],{},[138,5941,5942,5947,5948,5950,5951,5953,5954,5956,5957,5959],{},[32,5943,5944,5946],{},[25,5945,5878],{}," does not make fields required."," Listing a field in ",[25,5949,5878],{}," only defines its schema. You must also list it in ",[25,5952,5868],{}," to make it mandatory. A field can appear in ",[25,5955,5878],{}," but be absent from ",[25,5958,5868],{},", making it optional.",[138,5961,5962,5968,5969,5972,5973,5976,5977,5979],{},[32,5963,5964,5967],{},[25,5965,5966],{},"additionalProperties"," defaults to allowing extra fields."," If you do not set it to ",[25,5970,5971],{},"false",", an object with unexpected fields like ",[25,5974,5975],{},"\"debug\": true"," will pass validation. Only an explicit ",[25,5978,3629],{}," rejects undeclared fields.",[105,5981,1145,5983,5986],{"id":5982},"the-format-keyword-caveat",[25,5984,5985],{},"format"," keyword caveat",[28,5988,1145,5989,5991,5992,5997,5998,6005,6006,6009],{},[25,5990,5985],{}," keyword communicates an intended format, but whether it is enforced depends on the JSON Schema validator and its configuration. For example, ",[57,5993,5996],{"href":5994,"rel":5995},"https:\u002F\u002Fajv.js.org\u002Fapi.html",[81],"Ajv"," v7+ provides common format validators through the optional ",[57,5999,6002],{"href":6000,"rel":6001},"https:\u002F\u002Fajv.js.org\u002Fguide\u002Fformats.html",[81],[25,6003,6004],{},"ajv-formats"," package. Without it, ",[25,6007,6008],{},"\"format\": \"email\""," is treated as an annotation, not a validation rule. Always verify your validator's configuration before relying on format checks in production.",[105,6011,6013],{"id":6012},"a-valid-json-document-that-fails-schema-validation","A valid JSON document that fails schema validation",[28,6015,6016,6017,6019],{},"The payload from the introduction passes ",[25,6018,84],{}," but fails the schema:",[17,6021,6023],{"className":6022,"code":5578,"language":1354,"meta":23},[1352],[25,6024,5578],{"__ignoreMap":23},[28,6026,6027],{},"A schema validator would report these errors:",[162,6029,6030,6040],{},[165,6031,6032],{},[168,6033,6034,6037],{},[171,6035,6036],{},"Path",[171,6038,6039],{},"Problem",[181,6041,6042,6054,6071,6084,6101],{},[168,6043,6044,6049],{},[186,6045,6046],{},[25,6047,6048],{},"\u002Femail",[186,6050,6051,6052,69],{},"Value does not match format ",[25,6053,5593],{},[168,6055,6056,6061],{},[186,6057,6058],{},[25,6059,6060],{},"\u002Fage",[186,6062,6063,6064,6067,6068,69],{},"Value ",[25,6065,6066],{},"-3"," is less than minimum ",[25,6069,6070],{},"0",[168,6072,6073,6078],{},[186,6074,6075],{},[25,6076,6077],{},"\u002Frole",[186,6079,6063,6080,6083],{},[25,6081,6082],{},"superadmin"," is not one of the allowed enum values.",[168,6085,6086,6091],{},[186,6087,6088],{},[25,6089,6090],{},"\u002FmarketingOptIn",[186,6092,6093,6094,6097,6098,69],{},"Expected ",[25,6095,6096],{},"boolean",", got ",[25,6099,6100],{},"string",[168,6102,6103,6108],{},[186,6104,6105],{},[25,6106,6107],{},"\u002Fdebug",[186,6109,6110,6111,6113,6114,6116,6117,69],{},"Property ",[25,6112,5617],{}," is not allowed when ",[25,6115,5966],{}," is ",[25,6118,5971],{},[28,6120,6121,6122,6124],{},"You can test this interactively with the ",[57,6123,1968],{"href":1967}," — paste the payload and the schema side by side to see the errors.",[71,6126,6128],{"id":6127},"layer-3-business-validation-can-your-application-accept-this-data","Layer 3: Business Validation — Can Your Application Accept This Data?",[28,6130,6131],{},"Schema validation is powerful, but it cannot express rules that depend on your system's state. Business validation handles those cases with application logic.",[105,6133,6135],{"id":6134},"examples-json-schema-cannot-fully-decide","Examples JSON Schema cannot fully decide",[135,6137,6138,6148,6158,6167,6176],{},[138,6139,6140,6141,6144,6145,6147],{},"The email address ",[25,6142,6143],{},"ada@example.com"," is syntactically valid and matches the ",[25,6146,5593],{}," format, but it may already exist in your database.",[138,6149,6150,6151,6153,6154,6157],{},"An ",[25,6152,5599],{}," of 200 passes the ",[25,6155,6156],{},"minimum: 0"," check but may be rejected by a business rule capping realistic ages.",[138,6159,6160,6161,6163,6164,69],{},"A user's ",[25,6162,5605],{}," may be valid per the enum, but the authenticated caller may not have permission to assign ",[25,6165,6166],{},"admin",[138,6168,1051,6169,953,6172,6175],{},[25,6170,6171],{},"startDate",[25,6173,6174],{},"endDate"," may both be valid ISO 8601 strings, but the start may fall after the end.",[138,6177,6178],{},"A product ID may exist in the schema, but the product may be out of stock.",[28,6180,6181],{},"These checks require querying a database, verifying permissions, or running application-specific logic. No JSON Schema can replace them.",[105,6183,6185],{"id":6184},"client-side-versus-server-side-validation","Client-side versus server-side validation",[28,6187,6188],{},"Run schema validation on both the client and the server when it improves user feedback. But always validate again on the backend. Client-side checks:",[135,6190,6191,6194,6197],{},[138,6192,6193],{},"Can be bypassed by modifying network requests.",[138,6195,6196],{},"Cannot safely enforce permissions or database constraints.",[138,6198,6199],{},"Should be treated as a UX convenience, not a security measure.",[71,6201,6203],{"id":6202},"how-to-validate-json-in-javascript","How to Validate JSON in JavaScript",[28,6205,6206,6207,6209],{},"Here is a complete validation pipeline for the ",[25,6208,5573],{}," endpoint.",[105,6211,6213],{"id":6212},"step-1-syntax-validation","Step 1: Syntax validation",[17,6215,6218],{"className":6216,"code":6217,"language":5751,"meta":23},[5749],"import Ajv from 'ajv'\nimport addFormats from 'ajv-formats'\n\nconst ajv = new Ajv({ allErrors: true, strict: true })\naddFormats(ajv)\n\nconst createUserSchema = {\n  type: 'object',\n  additionalProperties: false,\n  required: ['email', 'age', 'role', 'marketingOptIn'],\n  properties: {\n    email: { type: 'string', format: 'email' },\n    age: { type: 'integer', minimum: 0, maximum: 150 },\n    role: { type: 'string', enum: ['user', 'editor', 'admin'] },\n    marketingOptIn: { type: 'boolean' },\n  },\n} as const\n\nconst validateCreateUser = ajv.compile(createUserSchema)\n",[25,6219,6217],{"__ignoreMap":23},[28,6221,6222,6223,6226,6227,69],{},"Ajv compiles the schema into a reusable validation function. It supports multiple JSON Schema drafts and reports all errors when ",[25,6224,6225],{},"allErrors"," is set to ",[25,6228,6229],{},"true",[105,6231,6233],{"id":6232},"step-2-schema-validation","Step 2: Schema validation",[17,6235,6238],{"className":6236,"code":6237,"language":5751,"meta":23},[5749],"export function validateCreateUserPayload(value: unknown) {\n  const valid = validateCreateUser(value)\n  return {\n    valid: Boolean(valid),\n    errors: validateCreateUser.errors ?? [],\n  }\n}\n",[25,6239,6237],{"__ignoreMap":23},[105,6241,6243],{"id":6242},"step-3-the-full-pipeline","Step 3: The full pipeline",[17,6245,6248],{"className":6246,"code":6247,"language":5751,"meta":23},[5749],"export function validateIncomingUserJson(text: string) {\n  \u002F\u002F Layer 1: Syntax\n  const parsed = parseJsonSafely(text)\n  if (!parsed.valid) {\n    return { ok: false as const, stage: 'syntax' as const, errors: [parsed.error] }\n  }\n\n  \u002F\u002F Layer 2: Schema\n  const schemaResult = validateCreateUserPayload(parsed.value)\n  if (!schemaResult.valid) {\n    return { ok: false as const, stage: 'schema' as const, errors: schemaResult.errors }\n  }\n\n  \u002F\u002F Layer 3: Business (example — you would implement this with your DB\u002Flogic)\n  \u002F\u002F if (await emailAlreadyExists(parsed.value.email)) {\n  \u002F\u002F   return { ok: false, stage: 'business', errors: ['Email is already registered'] }\n  \u002F\u002F }\n\n  return { ok: true as const, value: parsed.value }\n}\n",[25,6249,6247],{"__ignoreMap":23},[28,6251,6252],{},"This function runs the cheapest check first. If syntax fails, there is no point running schema validation. If schema fails, there is no point querying the database.",[71,6254,6256],{"id":6255},"api-error-response-design","API Error Response Design",[28,6258,6259],{},"A well-designed API returns different error shapes depending on which validation layer failed.",[105,6261,6263],{"id":6262},"syntax-error-400-bad-request","Syntax error → 400 Bad Request",[17,6265,6268],{"className":6266,"code":6267,"language":1354,"meta":23},[1352],"{\n  \"error\": {\n    \"code\": \"INVALID_JSON\",\n    \"message\": \"Request body is not valid JSON.\"\n  }\n}\n",[25,6269,6267],{"__ignoreMap":23},[105,6271,6273],{"id":6272},"schema-error-422-unprocessable-entity","Schema error → 422 Unprocessable Entity",[17,6275,6278],{"className":6276,"code":6277,"language":1354,"meta":23},[1352],"{\n  \"error\": {\n    \"code\": \"VALIDATION_FAILED\",\n    \"message\": \"Request data does not match the expected schema.\",\n    \"fields\": [\n      { \"path\": \"\u002Femail\", \"message\": \"must match format \\\"email\\\"\" },\n      { \"path\": \"\u002Fage\", \"message\": \"must be >= 0\" },\n      { \"path\": \"\u002FmarketingOptIn\", \"message\": \"must be boolean\" }\n    ]\n  }\n}\n",[25,6279,6277],{"__ignoreMap":23},[105,6281,6283],{"id":6282},"business-rule-error-409-conflict-or-422","Business-rule error → 409 Conflict or 422",[17,6285,6288],{"className":6286,"code":6287,"language":1354,"meta":23},[1352],"{\n  \"error\": {\n    \"code\": \"EMAIL_ALREADY_EXISTS\",\n    \"message\": \"An account already uses this email address.\"\n  }\n}\n",[25,6289,6287],{"__ignoreMap":23},[28,6291,6292],{},"Many APIs use 400 for malformed JSON and 422 for structurally valid data that fails validation, but your API should follow one documented and consistent convention.",[71,6294,6296],{"id":6295},"common-json-validation-mistakes","Common JSON Validation Mistakes",[105,6298,6300],{"id":6299},"mistake-1-treating-jsonparse-success-as-api-validation","Mistake 1: Treating JSON.parse() success as API validation",[28,6302,6303,6305],{},[25,6304,84],{}," succeeding only means the text is valid JSON. It says nothing about whether the data matches your API contract. Always run schema validation after parsing.",[105,6307,6309],{"id":6308},"mistake-2-relying-on-content-type-alone","Mistake 2: Relying on Content-Type alone",[28,6311,6312,6313,6315],{},"A request with ",[25,6314,747],{}," header may still contain a body that is not valid JSON. Always parse and validate the body, not just the header.",[105,6317,6319],{"id":6318},"mistake-3-allowing-unknown-fields-accidentally","Mistake 3: Allowing unknown fields accidentally",[28,6321,6322,6323,6325],{},"If your schema does not include ",[25,6324,3629],{},", unexpected fields pass through silently. This can leak internal debug data into your system or cause subtle bugs when clients send fields you did not expect.",[105,6327,6329],{"id":6328},"mistake-4-coercing-values-without-documenting-it","Mistake 4: Coercing values without documenting it",[28,6331,6332,6333,2376,6336,223,6338,2376,6341,6343],{},"Some frameworks silently convert ",[25,6334,6335],{},"\"42\"",[25,6337,2682],{},[25,6339,6340],{},"\"true\"",[25,6342,6229],{},". If your API does this, document it clearly. Silent coercion can hide client bugs and make debugging harder. When in strict mode, Ajv rejects type mismatches rather than coercing them.",[105,6345,6347],{"id":6346},"mistake-5-validating-only-in-the-browser","Mistake 5: Validating only in the browser",[28,6349,6350],{},"Client-side validation improves UX but can be bypassed. Every request that modifies data must be validated again on the server.",[105,6352,6354],{"id":6353},"mistake-6-logging-raw-invalid-payloads-with-secrets","Mistake 6: Logging raw invalid payloads with secrets",[28,6356,6357],{},"When logging validation failures, strip or redact sensitive fields like tokens, passwords, and API keys before writing to logs.",[71,6359,6361],{"id":6360},"a-practical-api-validation-workflow","A Practical API Validation Workflow",[28,6363,6364],{},"For each incoming JSON request:",[530,6366,6367,6373,6382,6388,6394,6400],{},[138,6368,6369,6372],{},[32,6370,6371],{},"Enforce a body-size limit."," Reject payloads that exceed your expected maximum before parsing.",[138,6374,6375,6378,6379,6381],{},[32,6376,6377],{},"Parse the JSON."," Use ",[25,6380,84],{}," or an equivalent. If it fails, return a 400 error with the parse error message.",[138,6383,6384,6387],{},[32,6385,6386],{},"Validate against a schema."," Check required fields, types, ranges, and additional properties. If it fails, return a 422 error with the list of schema violations.",[138,6389,6390,6393],{},[32,6391,6392],{},"Apply business rules."," Check database constraints, permissions, and application logic. If it fails, return a 409 or 422 error with a specific error code.",[138,6395,6396,6399],{},[32,6397,6398],{},"Return structured errors."," Include a machine-readable error code, a human-readable message, and field-level details for schema errors.",[138,6401,6402,6405],{},[32,6403,6404],{},"Log safely."," Redact sensitive fields before writing to logs.",[71,6407,801],{"id":800},[105,6409,6411],{"id":6410},"does-jsonparse-validate-json-schema","Does JSON.parse() validate JSON Schema?",[28,6413,6414,6415,6417,6418,6421],{},"No. ",[25,6416,84],{}," only checks whether a string follows JSON syntax and converts it into a JavaScript value. It does not check whether required fields exist, whether values have expected types, or whether extra fields are allowed. Use a schema validator like ",[57,6419,5996],{"href":5994,"rel":6420},[81]," for that.",[105,6423,6425],{"id":6424},"is-valid-json-always-safe-to-use-as-api-data","Is valid JSON always safe to use as API data?",[28,6427,6428,6429,6431,6432,6434],{},"No. A payload may be syntactically valid JSON but still fail your API contract. For example, an ",[25,6430,5599],{}," field may be negative, a required field may be missing, or a ",[25,6433,5605],{}," may not be one of the allowed values. Syntax validation is only the first layer.",[105,6436,6438],{"id":6437},"should-i-validate-json-in-the-frontend-or-backend","Should I validate JSON in the frontend or backend?",[28,6440,6441],{},"Validate on both when it improves user feedback, but always validate again on the backend. Client-side checks can be bypassed and cannot safely enforce permissions, database constraints, or other server-side business rules.",[105,6443,6445,6446,6448],{"id":6444},"does-format-email-always-validate-email-addresses","Does ",[25,6447,6008],{}," always validate email addresses?",[28,6450,6451,6452,6457],{},"Not necessarily. JSON Schema validators differ in how they implement and enable format checks. With Ajv, common formats are provided through the ",[57,6453,6455],{"href":6000,"rel":6454},[81],[25,6456,6004],{}," package, so confirm your validator configuration before relying on format validation in production.",[71,6459,916],{"id":915},[135,6461,6462,6471,6480,6490],{},[138,6463,6464,6467,6468,6470],{},[32,6465,6466],{},"Already have a broken payload?"," Start with ",[57,6469,68],{"href":67}," to find and fix the syntax error.",[138,6472,6473,6476,6477,6479],{},[32,6474,6475],{},"Need to validate JSON against a schema?"," Use the ",[57,6478,1968],{"href":1967}," to paste your data and schema side by side.",[138,6481,6482,735,6485,6489],{},[32,6483,6484],{},"Want to inspect complex JSON structure?",[57,6486,6488],{"href":6487},"\u002Ftools\u002Fformat\u002Fjson-path-tester","View your JSON as an interactive tree"," to explore nested fields.",[138,6491,6492,6495,6496,6499],{},[32,6493,6494],{},"Building an API from scratch?"," Read our guide to ",[57,6497,6498],{"href":4418},"JSON best practices"," for error handling, validation, and response design.",[2172,6501],{},[28,6503,6504],{},[113,6505,2178],{},{"title":23,"searchDepth":959,"depth":959,"links":6507},[6508,6509,6515,6523,6527,6532,6537,6545,6546,6553],{"id":5566,"depth":959,"text":5567},{"id":5624,"depth":959,"text":5625,"children":6510},[6511,6512,6513,6514],{"id":5633,"depth":964,"text":5634},{"id":5678,"depth":964,"text":5679},{"id":5734,"depth":964,"text":5735},{"id":5765,"depth":964,"text":5766},{"id":5776,"depth":959,"text":5777,"children":6516},[6517,6518,6519,6520,6522],{"id":5783,"depth":964,"text":5784},{"id":5815,"depth":964,"text":5816},{"id":5836,"depth":964,"text":5837},{"id":5982,"depth":964,"text":6521},"The format keyword caveat",{"id":6012,"depth":964,"text":6013},{"id":6127,"depth":959,"text":6128,"children":6524},[6525,6526],{"id":6134,"depth":964,"text":6135},{"id":6184,"depth":964,"text":6185},{"id":6202,"depth":959,"text":6203,"children":6528},[6529,6530,6531],{"id":6212,"depth":964,"text":6213},{"id":6232,"depth":964,"text":6233},{"id":6242,"depth":964,"text":6243},{"id":6255,"depth":959,"text":6256,"children":6533},[6534,6535,6536],{"id":6262,"depth":964,"text":6263},{"id":6272,"depth":964,"text":6273},{"id":6282,"depth":964,"text":6283},{"id":6295,"depth":959,"text":6296,"children":6538},[6539,6540,6541,6542,6543,6544],{"id":6299,"depth":964,"text":6300},{"id":6308,"depth":964,"text":6309},{"id":6318,"depth":964,"text":6319},{"id":6328,"depth":964,"text":6329},{"id":6346,"depth":964,"text":6347},{"id":6353,"depth":964,"text":6354},{"id":6360,"depth":959,"text":6361},{"id":800,"depth":959,"text":801,"children":6547},[6548,6549,6550,6551],{"id":6410,"depth":964,"text":6411},{"id":6424,"depth":964,"text":6425},{"id":6437,"depth":964,"text":6438},{"id":6444,"depth":964,"text":6552},"Does \"format\": \"email\" always validate email addresses?",{"id":915,"depth":959,"text":916},"2026-09-03T00:00:00.000Z","Learn the difference between JSON syntax validation and JSON Schema validation. Understand three validation layers with practical JavaScript examples for validating API data safely.","\u002Fblog\u002Fcover\u002Fen\u002Fjson-validation-syntax-vs-schema-cover.svg",[998,5533],{},"\u002Fen\u002Fblog\u002Fjson-validation-syntax-vs-schema",{"slug":6561,"text":6562,"btn":6563},"json-schema-validator","Validate your JSON data against a JSON Schema:","Open JSON Schema Validator",{"title":3680,"description":6555},"en\u002Fblog\u002Fjson-validation-syntax-vs-schema",[1009,6567,3676,1011,6568,6569],"JSON Validation","API Validation","Data Validation","ZVmiUdPnjatrK0u75M9aYD2o6oxI2AkNmzhzFuX_CVs",{"id":6572,"title":6573,"author":6574,"body":6575,"category":991,"date":7549,"description":7550,"draft":994,"extension":995,"h1":5530,"image":7551,"lastmod":7549,"locales":7552,"meta":7554,"navigation":1000,"path":7555,"promo":7556,"seo":7558,"stem":7559,"tags":7560,"__hash__":7564},"blog\u002Fen\u002Fblog\u002Fjson-best-practices.md","JSON Best Practices in Real Projects: API Design, Performance, and Security","BulkPicTools Team",{"type":9,"value":6576,"toc":7508},[6577,6580,6591,6598,6606,6608,6612,6616,6619,6624,6630,6635,6641,6644,6672,6676,6682,6688,6691,6697,6700,6704,6710,6735,6738,6750,6752,6756,6760,6763,6783,6786,6800,6807,6811,6814,6820,6822,6830,6832,6848,6852,6854,6907,6909,6917,6919,6923,6927,6930,6936,6938,6946,6949,6961,6965,6968,6976,6979,6991,6994,7002,7006,7009,7015,7017,7025,7027,7031,7035,7038,7057,7060,7066,7068,7078,7082,7085,7101,7104,7110,7113,7117,7120,7154,7156,7161,7163,7167,7171,7174,7180,7182,7190,7194,7197,7203,7206,7208,7212,7216,7222,7230,7232,7237,7241,7244,7250,7252,7260,7262,7266,7270,7272,7278,7281,7289,7291,7305,7309,7311,7316,7318,7326,7328,7336,7340,7342,7348,7350,7358,7360,7368,7370,7374,7378,7415,7419,7455,7459,7480,7482,7486,7500],[28,6578,6579],{},"In most web projects, JSON has become the de facto standard for data exchange. But \"using JSON\" and \"using JSON well\" are two different things:",[135,6581,6582,6585,6588],{},[138,6583,6584],{},"Inconsistent response structures make frontend code hard to maintain;",[138,6586,6587],{},"Large JSON payloads cause page freezes and API timeouts;",[138,6589,6590],{},"Sensitive information accidentally ends up in responses, creating security risks.",[28,6592,6593,6594,6597],{},"This article covers ",[32,6595,6596],{},"API design, performance optimization, and security practices"," for using JSON in real-world projects, summarizing standards, anti-patterns, and checklists to help you build more robust frontend–backend systems.",[48,6599,6600],{},[28,6601,6602,6603,6605],{},"If you're designing or refactoring APIs, you can paste example JSON into the ",[57,6604,714],{"href":200}," on the homepage to adjust the structure while instantly checking format and validity.",[2172,6607],{},[71,6609,6611],{"id":6610},"_1-standardizing-api-response-structures","1. Standardizing API Response Structures",[105,6613,6615],{"id":6614},"_11-recommended-base-structure","1.1 Recommended Base Structure",[28,6617,6618],{},"For most business endpoints, use a consistent top-level structure, for example:",[28,6620,6621],{},[32,6622,6623],{},"Success response:",[17,6625,6628],{"className":6626,"code":6627,"language":1354,"meta":23},[1352],"{\n  \"success\": true,\n  \"data\": {\n    \"id\": 12345,\n    \"name\": \"Alice\",\n    \"email\": \"alice@example.com\"\n  },\n  \"meta\": {\n    \"requestId\": \"req_abc123\",\n    \"version\": \"v1\"\n  }\n}\n",[25,6629,6627],{"__ignoreMap":23},[28,6631,6632],{},[32,6633,6634],{},"Error response:",[17,6636,6639],{"className":6637,"code":6638,"language":1354,"meta":23},[1352],"{\n  \"success\": false,\n  \"error\": {\n    \"code\": \"USER_NOT_FOUND\",\n    \"message\": \"User with ID 12345 not found\",\n    \"details\": {\n      \"userId\": 12345\n    }\n  },\n  \"meta\": {\n    \"requestId\": \"req_xyz789\",\n    \"version\": \"v1\"\n  }\n}\n",[25,6640,6638],{"__ignoreMap":23},[28,6642,6643],{},"Benefits:",[135,6645,6646,6653,6666],{},[138,6647,6648,6649,6652],{},"The frontend only needs to check the ",[25,6650,6651],{},"success"," field to distinguish success vs. error.",[138,6654,6655,6656,953,6659,6662,6663,6665],{},"Separating ",[25,6657,6658],{},"data",[25,6660,6661],{},"error"," avoids accessing non-existent ",[25,6664,6658],{}," on errors.",[138,6667,6668,6671],{},[25,6669,6670],{},"meta"," can hold trace IDs, versions, etc., for logging and monitoring.",[105,6673,6675],{"id":6674},"_12-list-endpoints-and-pagination-structure","1.2 List Endpoints and Pagination Structure",[28,6677,6678,6679,6681],{},"For list endpoints, use an array in ",[25,6680,6658],{}," with a consistent pagination structure:",[17,6683,6686],{"className":6684,"code":6685,"language":1354,"meta":23},[1352],"{\n  \"success\": true,\n  \"data\": [\n    { \"id\": 1, \"title\": \"JSON Guide\" },\n    { \"id\": 2, \"title\": \"API Design Tips\" }\n  ],\n  \"pagination\": {\n    \"page\": 1,\n    \"pageSize\": 20,\n    \"total\": 58,\n    \"totalPages\": 3\n  }\n}\n",[25,6687,6685],{"__ignoreMap":23},[28,6689,6690],{},"Or cursor-based pagination (better for large datasets):",[17,6692,6695],{"className":6693,"code":6694,"language":1354,"meta":23},[1352],"{\n  \"success\": true,\n  \"data\": [\n    { \"id\": 101, \"title\": \"...\" },\n    { \"id\": 102, \"title\": \"...\" }\n  ],\n  \"cursor\": {\n    \"next\": \"eyJpZCI6MTAyfQ==\",\n    \"prev\": \"eyJpZCI6MTAxfQ==\"\n  }\n}\n",[25,6696,6694],{"__ignoreMap":23},[28,6698,6699],{},"The frontend can then encapsulate unified list components and pagination logic.",[105,6701,6703],{"id":6702},"_13-error-code-design-recommendations","1.3 Error Code Design Recommendations",[28,6705,6706,6707,6709],{},"In the ",[25,6708,6661],{}," object, include at least:",[135,6711,6712,6723,6729],{},[138,6713,6714,6716,6717,265,6720,69],{},[25,6715,25],{},": Machine-readable error code, e.g., ",[25,6718,6719],{},"USER_NOT_FOUND",[25,6721,6722],{},"INVALID_JSON",[138,6724,6725,6728],{},[25,6726,6727],{},"message",": Human-readable description, suitable for UI display.",[138,6730,6731,6734],{},[25,6732,6733],{},"details"," (optional): Structured details for finer-grained handling or logging.",[28,6736,6737],{},"Avoid:",[135,6739,6740,6747],{},[138,6741,6742,6743,6746],{},"Returning only a string: ",[25,6744,6745],{},"\"User not found\"",", making it hard for the frontend to distinguish error types.",[138,6748,6749],{},"Exposing full stack traces to the client (security risk).",[2172,6751],{},[71,6753,6755],{"id":6754},"_2-field-naming-and-type-conventions","2. Field Naming and Type Conventions",[105,6757,6759],{"id":6758},"_21-naming-style-camelcase-vs-snake_case","2.1 Naming Style: camelCase vs snake_case",[28,6761,6762],{},"Two common naming styles in JSON:",[135,6764,6765,6774],{},[138,6766,6767,6768,265,6771],{},"camelCase: ",[25,6769,6770],{},"userId",[25,6772,6773],{},"createdAt",[138,6775,6776,6777,265,6780],{},"snake_case: ",[25,6778,6779],{},"user_id",[25,6781,6782],{},"created_at",[28,6784,6785],{},"Recommendations:",[135,6787,6788,6794,6797],{},[138,6789,6790,6793],{},[32,6791,6792],{},"Standardize on one style"," within a project and team.",[138,6795,6796],{},"If your frontend is primarily JavaScript\u002FTypeScript, camelCase is usually more natural.",[138,6798,6799],{},"If your backend heavily uses frameworks that default to snake_case (e.g., Django), normalize at the serialization layer.",[28,6801,6802,6803,6806],{},"The key is: ",[32,6804,6805],{},"keep public APIs consistent",", avoid mixing styles within the same endpoint.",[105,6808,6810],{"id":6809},"_22-dates-and-times-use-iso-8601-consistently","2.2 Dates and Times: Use ISO 8601 Consistently",[28,6812,6813],{},"Recommend using ISO 8601 strings for all date\u002Ftime fields:",[17,6815,6818],{"className":6816,"code":6817,"language":1354,"meta":23},[1352],"{\n  \"createdAt\": \"2026-08-25T08:00:00Z\",\n  \"updatedAt\": \"2026-08-25T08:30:00+08:00\"\n}\n",[25,6819,6817],{"__ignoreMap":23},[28,6821,6643],{},[135,6823,6824,6827],{},[138,6825,6826],{},"Language-agnostic, with mature parsing libraries in almost every language.",[138,6828,6829],{},"Explicit timezone information avoids \"local time vs UTC\" ambiguity.",[28,6831,6737],{},[135,6833,6834,6841],{},[138,6835,6836,6837,6840],{},"Using numeric timestamps (",[25,6838,6839],{},"1724572800",") without specifying units (seconds\u002Fmilliseconds).",[138,6842,6843,6844,6847],{},"Using custom formats (",[25,6845,6846],{},"\"2026\u002F08\u002F25 08:00\"","), increasing frontend parsing overhead.",[105,6849,6851],{"id":6850},"_23-using-null-empty-objects-and-empty-arrays","2.3 Using null, Empty Objects, and Empty Arrays",[28,6853,6785],{},[135,6855,6856,6868,6877],{},[138,6857,6858,6859,6861,6862],{},"For \"missing\" scalar fields, use ",[25,6860,337],{},":\n",[17,6863,6866],{"className":6864,"code":6865,"language":1354,"meta":23},[1352],"{\n  \"phone\": null\n}\n",[25,6867,6865],{"__ignoreMap":23},[138,6869,6870,6871],{},"For \"empty lists\", use empty arrays:\n",[17,6872,6875],{"className":6873,"code":6874,"language":1354,"meta":23},[1352],"{\n  \"orders\": []\n}\n",[25,6876,6874],{"__ignoreMap":23},[138,6878,6879,6880,6902,6903,6906],{},"For \"missing objects\", two common strategies:\n",[135,6881,6882,6893],{},[138,6883,6884,6885,6861,6887],{},"Return ",[25,6886,337],{},[17,6888,6891],{"className":6889,"code":6890,"language":1354,"meta":23},[1352],"{\n  \"profile\": null\n}\n",[25,6892,6890],{"__ignoreMap":23},[138,6894,6895,6896],{},"Return an empty object:\n",[17,6897,6900],{"className":6898,"code":6899,"language":1354,"meta":23},[1352],"{\n  \"profile\": {}\n}\n",[25,6901,6899],{"__ignoreMap":23},"\nThe key is: ",[32,6904,6905],{},"standardize on one strategy"," within the project and document it.",[28,6908,6737],{},[135,6910,6911],{},[138,6912,6913,6914,6916],{},"Sometimes returning ",[25,6915,337],{},", sometimes omitting the field entirely, forcing the frontend to handle multiple cases.",[2172,6918],{},[71,6920,6922],{"id":6921},"_3-performance-related-practices","3. Performance-Related Practices",[105,6924,6926],{"id":6925},"_31-return-only-necessary-fields","3.1 Return Only Necessary Fields",[28,6928,6929],{},"Return only the fields the frontend actually needs, instead of dumping entire tables:",[17,6931,6934],{"className":6932,"code":6933,"language":1354,"meta":23},[1352],"\u002F\u002F Avoid\n{\n  \"id\": 1,\n  \"name\": \"Alice\",\n  \"email\": \"alice@example.com\",\n  \"passwordHash\": \"...\",\n  \"internalFlags\": { ... },\n  \"createdAt\": \"...\",\n  \"updatedAt\": \"...\",\n  \"extraMeta\": { ... }\n}\n\n\u002F\u002F Recommended\n{\n  \"id\": 1,\n  \"name\": \"Alice\",\n  \"email\": \"alice@example.com\"\n}\n",[25,6935,6933],{"__ignoreMap":23},[28,6937,6643],{},[135,6939,6940,6943],{},[138,6941,6942],{},"Reduces payload size and improves response time.",[138,6944,6945],{},"Lowers the risk of leaking sensitive information.",[28,6947,6948],{},"Implementation:",[135,6950,6951,6954],{},[138,6952,6953],{},"Use DTO\u002FVO (Data Transfer Object \u002F View Object) layers on the backend to expose only necessary fields.",[138,6955,6956,6957,6960],{},"For complex objects, support a ",[25,6958,6959],{},"fields"," query parameter to let the frontend select fields (suitable for open APIs).",[105,6962,6964],{"id":6963},"_32-large-lists-pagination-and-streaming","3.2 Large Lists: Pagination and Streaming",[28,6966,6967],{},"For potentially large lists:",[135,6969,6970,6973],{},[138,6971,6972],{},"Always use pagination (page-based or cursor-based).",[138,6974,6975],{},"Avoid returning tens of thousands of records in one response.",[28,6977,6978],{},"Backend:",[135,6980,6981,6988],{},[138,6982,6983,6984,6987],{},"Use database pagination (",[25,6985,6986],{},"LIMIT\u002FOFFSET"," or cursors).",[138,6989,6990],{},"For very large export endpoints, consider async jobs + file download instead of synchronous large JSON responses.",[28,6992,6993],{},"Frontend:",[135,6995,6996,6999],{},[138,6997,6998],{},"Use virtual lists \u002F lazy loading to avoid rendering huge DOM trees at once.",[138,7000,7001],{},"For very large JSON, avoid heavy computation on the main thread; consider Web Workers.",[105,7003,7005],{"id":7004},"_33-reduce-nesting-depth-and-redundancy","3.3 Reduce Nesting Depth and Redundancy",[28,7007,7008],{},"Excessive nesting and redundant fields increase parsing cost:",[17,7010,7013],{"className":7011,"code":7012,"language":1354,"meta":23},[1352],"\u002F\u002F Avoid: deep nesting + redundancy\n{\n  \"data\": {\n    \"user\": {\n      \"profile\": {\n        \"info\": {\n          \"name\": \"Alice\",\n          \"extra\": {\n            \"unusedField\": \"...\"\n          }\n        }\n      }\n    }\n  }\n}\n\n\u002F\u002F Recommended: flatter, only necessary structure\n{\n  \"data\": {\n    \"userId\": 1,\n    \"name\": \"Alice\"\n  }\n}\n",[25,7014,7012],{"__ignoreMap":23},[28,7016,6785],{},[135,7018,7019,7022],{},[138,7020,7021],{},"Keep nesting depth around 3–5 levels.",[138,7023,7024],{},"Periodically review endpoint responses and remove unused fields.",[2172,7026],{},[71,7028,7030],{"id":7029},"_4-security-related-practices","4. Security-Related Practices",[105,7032,7034],{"id":7033},"_41-avoid-exposing-sensitive-information-in-json","4.1 Avoid Exposing Sensitive Information in JSON",[28,7036,7037],{},"Common but dangerous practices:",[135,7039,7040],{},[138,7041,7042,7043],{},"Returning in responses:\n",[135,7044,7045,7048,7051,7054],{},[138,7046,7047],{},"Passwords or password hashes",[138,7049,7050],{},"Internal keys, tokens",[138,7052,7053],{},"Full stack traces",[138,7055,7056],{},"Internal IDs, internal service URLs",[28,7058,7059],{},"Example (wrong):",[17,7061,7064],{"className":7062,"code":7063,"language":1354,"meta":23},[1352],"{\n  \"user\": {\n    \"id\": 1,\n    \"name\": \"Alice\",\n    \"passwordHash\": \"$2b$10$...\",\n    \"internalToken\": \"sk_live_...\"\n  }\n}\n",[25,7065,7063],{"__ignoreMap":23},[28,7067,6785],{},[135,7069,7070,7073],{},[138,7071,7072],{},"Use dedicated \"public view\" objects that include only exposable fields.",[138,7074,7075,7076,69],{},"For error responses, use generic messages; do not expose stack traces or internal details in ",[25,7077,6727],{},[105,7079,7081],{"id":7080},"_42-validate-user-input-before-parsing","4.2 Validate User Input Before Parsing",[28,7083,7084],{},"For JSON data from users or third parties:",[135,7086,7087,7090,7093],{},[138,7088,7089],{},"Apply length limits (e.g., max 1MB).",[138,7091,7092],{},"Perform basic character validation (e.g., printable UTF-8 only).",[138,7094,781,7095,7097,7098,69],{},[25,7096,634],{}," in ",[25,7099,7100],{},"try...catch",[28,7102,7103],{},"Node.js example:",[17,7105,7108],{"className":7106,"code":7107,"language":94,"meta":23},[92],"function safeParseJson(text, maxSize = 1024 * 1024) {\n  if (typeof text !== 'string') {\n    throw new Error('Input must be a string');\n  }\n  if (text.length > maxSize) {\n    throw new Error('JSON too large');\n  }\n  try {\n    return JSON.parse(text);\n  } catch (e) {\n    throw new Error('Invalid JSON: ' + e.message);\n  }\n}\n",[25,7109,7107],{"__ignoreMap":23},[28,7111,7112],{},"For critical business data, further validate structure using JSON Schema \u002F Zod \u002F Joi.",[105,7114,7116],{"id":7115},"_43-sanitize-sensitive-fields-in-logs","4.3 Sanitize Sensitive Fields in Logs",[28,7118,7119],{},"When logging request\u002Fresponse JSON on the server:",[135,7121,7122],{},[138,7123,7124,7125],{},"Sanitize sensitive fields:\n",[135,7126,7127,7134,7142],{},[138,7128,7129,1611,7131],{},[25,7130,5593],{},[25,7132,7133],{},"ali***@example.com",[138,7135,7136,1611,7139],{},[25,7137,7138],{},"phone",[25,7140,7141],{},"138****1234",[138,7143,7144,5899,7147,7150,7151,69],{},[25,7145,7146],{},"token",[25,7148,7149],{},"password",": either omit or log as ",[25,7152,7153],{},"***",[28,7155,6737],{},[135,7157,7158],{},[138,7159,7160],{},"Writing complete requests\u002Fresponses to logs as-is, especially when they contain authentication or payment information.",[2172,7162],{},[71,7164,7166],{"id":7165},"_5-integrating-with-typescript-json-schema","5. Integrating with TypeScript \u002F JSON Schema",[105,7168,7170],{"id":7169},"_51-define-api-types-with-typescript","5.1 Define API Types with TypeScript",[28,7172,7173],{},"In TypeScript projects, define explicit types for each endpoint:",[17,7175,7178],{"className":7176,"code":7177,"language":5751,"meta":23},[5749],"interface GetUserResponse {\n  success: true;\n  data: {\n    id: number;\n    name: string;\n    email: string;\n  };\n  meta: {\n    requestId: string;\n    version: string;\n  };\n}\n\ninterface ApiError {\n  success: false;\n  error: {\n    code: string;\n    message: string;\n    details?: Record\u003Cstring, any>;\n  };\n  meta: {\n    requestId: string;\n    version: string;\n  };\n}\n\ntype GetUserResult = GetUserResponse | ApiError;\n",[25,7179,7177],{"__ignoreMap":23},[28,7181,6643],{},[135,7183,7184,7187],{},[138,7185,7186],{},"The compiler catches field name errors and type mismatches early.",[138,7188,7189],{},"Autocomplete improves developer productivity.",[105,7191,7193],{"id":7192},"_52-use-json-schema-for-runtime-validation","5.2 Use JSON Schema for Runtime Validation",[28,7195,7196],{},"For third-party data or critical endpoints, define structure with JSON Schema and validate at runtime:",[17,7198,7201],{"className":7199,"code":7200,"language":1354,"meta":23},[1352],"{\n  \"$schema\": \"http:\u002F\u002Fjson-schema.org\u002Fdraft-07\u002Fschema#\",\n  \"type\": \"object\",\n  \"required\": [\"success\", \"data\", \"meta\"],\n  \"properties\": {\n    \"success\": { \"type\": \"boolean\" },\n    \"data\": { \"type\": \"object\" },\n    \"meta\": {\n      \"type\": \"object\",\n      \"required\": [\"requestId\", \"version\"],\n      \"properties\": {\n        \"requestId\": { \"type\": \"string\" },\n        \"version\": { \"type\": \"string\" }\n      }\n    }\n  }\n}\n",[25,7202,7200],{"__ignoreMap":23},[28,7204,7205],{},"With a validation library, you can intercept non-conforming responses at runtime and surface issues early.",[2172,7207],{},[71,7209,7211],{"id":7210},"_6-json-in-configuration-and-logs","6. JSON in Configuration and Logs",[105,7213,7215],{"id":7214},"_61-configuration-files-strict-json-or-jsonc","6.1 Configuration Files: Strict JSON or JSONC",[28,7217,7218,7219,7221],{},"For configuration files (e.g., ",[25,7220,3639],{},"):",[135,7223,7224,7227],{},[138,7225,7226],{},"Prefer strict JSON, avoiding comments and trailing commas.",[138,7228,7229],{},"If comments are truly needed, use JSONC (JSON with comments), but ensure your parser supports it.",[28,7231,6737],{},[135,7233,7234],{},[138,7235,7236],{},"Mixing single quotes, comments, and trailing commas in configs, leading to inconsistent parsing across environments.",[105,7238,7240],{"id":7239},"_62-field-conventions-for-structured-logs","6.2 Field Conventions for Structured Logs",[28,7242,7243],{},"For structured JSON logs, standardize field conventions, e.g.:",[17,7245,7248],{"className":7246,"code":7247,"language":1354,"meta":23},[1352],"{\n  \"timestamp\": \"2026-08-25T08:00:00Z\",\n  \"level\": \"info\",\n  \"service\": \"user-api\",\n  \"traceId\": \"req_abc123\",\n  \"userId\": 12345,\n  \"action\": \"get_user\",\n  \"status\": \"success\",\n  \"durationMs\": 42\n}\n",[25,7249,7247],{"__ignoreMap":23},[28,7251,6643],{},[135,7253,7254,7257],{},[138,7255,7256],{},"Easier to query and aggregate in ELK \u002F Cloudflare Logs and similar systems.",[138,7258,7259],{},"Unified fields simplify alerts and dashboards.",[2172,7261],{},[71,7263,7265],{"id":7264},"_7-common-anti-patterns","7. Common Anti-Patterns",[105,7267,7269],{"id":7268},"_71-embedding-html-rich-text-in-json-without-clarification","7.1 Embedding HTML \u002F Rich Text in JSON Without Clarification",[28,7271,5278],{},[17,7273,7276],{"className":7274,"code":7275,"language":1354,"meta":23},[1352],"{\n  \"content\": \"\u003Cp>Hello \u003Cstrong>world\u003C\u002Fstrong>\u003C\u002Fp>\"\n}\n",[25,7277,7275],{"__ignoreMap":23},[28,7279,7280],{},"Issues:",[135,7282,7283,7286],{},[138,7284,7285],{},"If the frontend doesn't know this is HTML, it may render it as plain text.",[138,7287,7288],{},"XSS risk if inserted into the DOM without proper escaping\u002Ffiltering.",[28,7290,6785],{},[135,7292,7293,7302],{},[138,7294,7295,7296,265,7299,69],{},"Use explicit field names like ",[25,7297,7298],{},"contentHtml",[25,7300,7301],{},"contentMarkdown",[138,7303,7304],{},"Frontend should decide whether to render as HTML based on the field name and apply proper escaping\u002Ffiltering.",[105,7306,7308],{"id":7307},"_72-using-json-to-transfer-large-binaries","7.2 Using JSON to Transfer Large Binaries",[28,7310,5278],{},[135,7312,7313],{},[138,7314,7315],{},"Base64-encoding images or files and putting them in JSON fields.",[28,7317,7280],{},[135,7319,7320,7323],{},[138,7321,7322],{},"Size bloat (base64 increases size by ~33%).",[138,7324,7325],{},"High parsing and transmission cost.",[28,7327,6785],{},[135,7329,7330,7333],{},[138,7331,7332],{},"Use dedicated file upload endpoints and return file URLs or IDs.",[138,7334,7335],{},"Keep only metadata (URL, size, type) in JSON.",[105,7337,7339],{"id":7338},"_73-returning-half-json-half-text-mixed-content","7.3 Returning \"Half JSON, Half Text\" Mixed Content",[28,7341,5278],{},[17,7343,7346],{"className":7344,"code":7345,"language":22,"meta":23},[20],"{\"success\":true}\n\u003C!-- debug info -->\n",[25,7347,7345],{"__ignoreMap":23},[28,7349,7280],{},[135,7351,7352,7355],{},[138,7353,7354],{},"Cannot be parsed with standard JSON parsers.",[138,7356,7357],{},"May \"look fine\" during debugging but fail in production.",[28,7359,6785],{},[135,7361,7362,7365],{},[138,7363,7364],{},"Use either pure JSON or pure HTML\u002Ftext, not mixed.",[138,7366,7367],{},"Output debug info via dedicated headers or logging systems, not appended to the response body.",[2172,7369],{},[71,7371,7373],{"id":7372},"_8-checklist","8. Checklist",[105,7375,7377],{"id":7376},"during-api-design","During API Design",[135,7379,7382,7391,7397,7403,7409],{"className":7380},[7381],"contains-task-list",[138,7383,7386,7390],{"className":7384},[7385],"task-list-item",[7387,7388],"input",{"disabled":1000,"type":7389},"checkbox"," Are success\u002Ferror response structures standardized?",[138,7392,7394,7396],{"className":7393},[7385],[7387,7395],{"disabled":1000,"type":7389}," Is there a unified error code convention?",[138,7398,7400,7402],{"className":7399},[7385],[7387,7401],{"disabled":1000,"type":7389}," Are dates\u002Ftimes consistently using ISO 8601?",[138,7404,7406,7408],{"className":7405},[7385],[7387,7407],{"disabled":1000,"type":7389}," Is field naming style (camelCase \u002F snake_case) consistent?",[138,7410,7412,7414],{"className":7411},[7385],[7387,7413],{"disabled":1000,"type":7389}," Are sensitive fields avoided in responses?",[105,7416,7418],{"id":7417},"during-frontend-parsing","During Frontend Parsing",[135,7420,7422,7432,7443,7449],{"className":7421},[7381],[138,7423,7425,7427,7428,7431],{"className":7424},[7385],[7387,7426],{"disabled":1000,"type":7389}," Do you check status code and ",[25,7429,7430],{},"Content-Type"," before parsing?",[138,7433,7435,7437,7438,7440,7441,3230],{"className":7434},[7385],[7387,7436],{"disabled":1000,"type":7389}," Are all ",[25,7439,634],{}," calls wrapped in ",[25,7442,7100],{},[138,7444,7446,7448],{"className":7445},[7385],[7387,7447],{"disabled":1000,"type":7389}," Is pagination\u002Flazy loading used for large JSON?",[138,7450,7452,7454],{"className":7451},[7385],[7387,7453],{"disabled":1000,"type":7389}," Are third-party\u002Fuser inputs validated for length and structure?",[105,7456,7458],{"id":7457},"logging-and-security","Logging and Security",[135,7460,7462,7468,7474],{"className":7461},[7381],[138,7463,7465,7467],{"className":7464},[7385],[7387,7466],{"disabled":1000,"type":7389}," Are sensitive fields sanitized in logs?",[138,7469,7471,7473],{"className":7470},[7385],[7387,7472],{"disabled":1000,"type":7389}," Are stack traces avoided in error responses?",[138,7475,7477,7479],{"className":7476},[7385],[7387,7478],{"disabled":1000,"type":7389}," Are config files using strict JSON or controlled JSONC?",[2172,7481],{},[71,7483,7485],{"id":7484},"summary","Summary",[135,7487,7488,7491,7494,7497],{},[138,7489,7490],{},"In frontend–backend projects, \"using JSON well\" is not just about correct syntax; it's about API design, performance, and security.",[138,7492,7493],{},"Standardizing response structures, field conventions, and error codes significantly reduces frontend–backend collaboration costs.",[138,7495,7496],{},"Through field minimization, pagination, and streaming, you can effectively optimize performance issues caused by large JSON.",[138,7498,7499],{},"On the security side, avoiding sensitive data exposure, validating input, and sanitizing logs are basic but often overlooked practices.",[48,7501,7502],{},[28,7503,7504,7505,7507],{},"When designing and debugging APIs, you can paste example JSON into the ",[57,7506,714],{"href":200}," to adjust structures while instantly checking format and validity, helping your team reach consensus faster.",{"title":23,"searchDepth":959,"depth":959,"links":7509},[7510,7515,7520,7525,7530,7534,7538,7543,7548],{"id":6610,"depth":959,"text":6611,"children":7511},[7512,7513,7514],{"id":6614,"depth":964,"text":6615},{"id":6674,"depth":964,"text":6675},{"id":6702,"depth":964,"text":6703},{"id":6754,"depth":959,"text":6755,"children":7516},[7517,7518,7519],{"id":6758,"depth":964,"text":6759},{"id":6809,"depth":964,"text":6810},{"id":6850,"depth":964,"text":6851},{"id":6921,"depth":959,"text":6922,"children":7521},[7522,7523,7524],{"id":6925,"depth":964,"text":6926},{"id":6963,"depth":964,"text":6964},{"id":7004,"depth":964,"text":7005},{"id":7029,"depth":959,"text":7030,"children":7526},[7527,7528,7529],{"id":7033,"depth":964,"text":7034},{"id":7080,"depth":964,"text":7081},{"id":7115,"depth":964,"text":7116},{"id":7165,"depth":959,"text":7166,"children":7531},[7532,7533],{"id":7169,"depth":964,"text":7170},{"id":7192,"depth":964,"text":7193},{"id":7210,"depth":959,"text":7211,"children":7535},[7536,7537],{"id":7214,"depth":964,"text":7215},{"id":7239,"depth":964,"text":7240},{"id":7264,"depth":959,"text":7265,"children":7539},[7540,7541,7542],{"id":7268,"depth":964,"text":7269},{"id":7307,"depth":964,"text":7308},{"id":7338,"depth":964,"text":7339},{"id":7372,"depth":959,"text":7373,"children":7544},[7545,7546,7547],{"id":7376,"depth":964,"text":7377},{"id":7417,"depth":964,"text":7418},{"id":7457,"depth":964,"text":7458},{"id":7484,"depth":959,"text":7485},"2026-08-25T00:00:00.000Z","A practical guide to using JSON in real projects, covering API design patterns, performance tips, security considerations, and common anti-patterns.","\u002Fblog\u002Fcover\u002Fen\u002Fjson-best-practices-cover.svg",[998,7553],"zh-CN",{},"\u002Fen\u002Fblog\u002Fjson-best-practices",{"slug":2220,"text":7557,"btn":2222},"🚀 Need to batch format or check JSON?",{"title":6573,"description":7550},"en\u002Fblog\u002Fjson-best-practices",[1009,714,7561,7562,7563],"API Design","Performance","Security","4bj8Q4T0OzJdG1mYSeLcjgIfpw6Fy7H3lLBPm_Z4iZA",{"id":7566,"title":68,"author":7,"body":7567,"category":991,"date":8866,"description":8867,"draft":994,"extension":995,"h1":5530,"image":8868,"lastmod":6554,"locales":8869,"meta":8870,"navigation":1000,"path":8871,"promo":8872,"seo":8874,"stem":8875,"tags":8876,"__hash__":8880},"blog\u002Fen\u002Fblog\u002Fjson-parse-error-debug.md",{"type":9,"value":7568,"toc":8797},[7569,7583,7591,7595,7598,7625,7632,7635,7637,7641,7645,7660,7666,7669,7683,7687,7729,7733,7761,7763,7769,7772,7788,7792,7808,7811,7827,7830,7851,7853,7857,7860,7885,7889,7922,7925,7938,7941,7949,7951,7955,7958,7981,7984,7996,7999,8036,8039,8059,8061,8065,8068,8071,8096,8099,8110,8113,8126,8129,8153,8155,8159,8162,8174,8177,8185,8188,8196,8199,8214,8216,8220,8223,8238,8241,8246,8249,8276,8279,8287,8289,8293,8296,8320,8323,8331,8334,8342,8345,8383,8385,8389,8392,8408,8411,8419,8422,8430,8433,8444,8446,8452,8455,8466,8469,8477,8480,8504,8507,8543,8550,8552,8556,8559,8637,8639,8643,8752,8754,8756,8767,8775,8777],[28,7570,7571,7572,7574,7575,7578,7579,7582],{},"In frontend and backend development, \"JSON parse failed\" is one of the most common errors: your code expects a JSON response, but ",[25,7573,634],{}," throws an exception and the console fills with red errors.",[7576,7577],"br",{},"\nThis article breaks down ",[32,7580,7581],{},"10 typical JSON parsing errors"," from real-world debugging scenarios, and provides actionable troubleshooting steps and prevention tips to help you quickly locate and fix the root cause.",[48,7584,7585],{},[28,7586,7587,7588,7590],{},"If you have a \"parse failed\" JSON sample on hand, paste it into the ",[57,7589,714],{"href":713}," to automatically check syntax and highlight the exact error position.",[71,7592,7594],{"id":7593},"overview-of-typical-error-messages","Overview of Typical Error Messages",[28,7596,7597],{},"Across different environments and scenarios, you might see errors like:",[135,7599,7600,7605,7610,7615,7620],{},[138,7601,7602],{},[25,7603,7604],{},"SyntaxError: Unexpected token ':' in JSON at position 3",[138,7606,7607],{},[25,7608,7609],{},"SyntaxError: Unexpected token '\u003C' in JSON at position 0",[138,7611,7612],{},[25,7613,7614],{},"SyntaxError: Unexpected token 'u' in JSON at position 20",[138,7616,7617],{},[25,7618,7619],{},"SyntaxError: Unexpected token '\u002F' in JSON at position 2",[138,7621,7622],{},[25,7623,7624],{},"JSONParseError: Unexpected end of JSON input",[28,7626,7627,7628,7631],{},"These all mean: ",[32,7629,7630],{},"the input is not valid JSON",", but the underlying reasons can be very different: format errors, HTML error pages, encoding issues, truncated responses, and more.",[28,7633,7634],{},"Below, we break them down by scenario.",[2172,7636],{},[71,7638,7640],{"id":7639},"scenario-1-backend-returns-an-html-error-page-500404","Scenario 1: Backend Returns an HTML Error Page (500\u002F404)",[105,7642,7644],{"id":7643},"symptoms","Symptoms",[135,7646,7647,7650,7653],{},[138,7648,7649],{},"Your frontend calls an API expecting JSON.",[138,7651,7652],{},"The actual status code is 500\u002F404\u002F503, and the body is an HTML error page.",[138,7654,7655,7656,7659],{},"The frontend still calls ",[25,7657,7658],{},"JSON.parse(responseText)"," and fails with:",[48,7661,7662],{},[28,7663,7664],{},[25,7665,7609],{},[105,7667,173],{"id":7668},"cause",[28,7670,7671,7672,223,7675,7678,7679,7682],{},"HTML usually starts with ",[25,7673,7674],{},"\u003C!DOCTYPE html>",[25,7676,7677],{},"\u003Chtml>",", so the first character is ",[25,7680,7681],{},"\u003C",", which is not valid JSON.",[105,7684,7686],{"id":7685},"debugging-steps","Debugging Steps",[530,7688,7689,7692,7699,7722],{},[138,7690,7691],{},"Open the browser's Network panel and find the request.",[138,7693,7694,7695,7698],{},"Check the ",[32,7696,7697],{},"Status"," code: is it 2xx?",[138,7700,7701,7702,7097,7704,6861,7707],{},"Check ",[25,7703,7430],{},[32,7705,7706],{},"Response Headers",[135,7708,7709,7714],{},[138,7710,7711,7712,3230],{},"Is it ",[25,7713,2285],{},[138,7715,7716,7717,5899,7719,3230],{},"Or ",[25,7718,1479],{},[25,7720,7721],{},"text\u002Fplain",[138,7723,7724,7725,7728],{},"Inspect the ",[32,7726,7727],{},"Response Body",": is it an HTML error page?",[105,7730,7732],{"id":7731},"solutions","Solutions",[135,7734,7735,7754],{},[138,7736,7737,7738,7740,7741],{},"Before calling ",[25,7739,634],{}," on the frontend:\n",[135,7742,7743,7746],{},[138,7744,7745],{},"Check that the status code is 2xx;",[138,7747,7748,7749,7751,7752,69],{},"Check that ",[25,7750,7430],{}," includes ",[25,7753,2285],{},[138,7755,7756,7757,7760],{},"For non-2xx responses, prioritize showing error information (e.g., ",[25,7758,7759],{},"error.message",") instead of trying to parse JSON.",[2172,7762],{},[71,7764,7766,7767],{"id":7765},"scenario-2-content-type-is-not-applicationjson","Scenario 2: Content-Type Is Not ",[25,7768,2285],{},[105,7770,7644],{"id":7771},"symptoms-1",[135,7773,7774,7783],{},[138,7775,7776,7777,6116,7779,223,7781,69],{},"The response body \"looks like JSON\", but ",[25,7778,7430],{},[25,7780,1479],{},[25,7782,7721],{},[138,7784,7785,7786,69],{},"Some frameworks\u002Fmiddleware refuse to auto-parse, or your code hesitates to safely call ",[25,7787,634],{},[105,7789,7791],{"id":7790},"causes","Causes",[135,7793,7794,7799,7802],{},[138,7795,7796,7797,5650],{},"Backend framework configuration (e.g., defaulting to ",[25,7798,1479],{},[138,7800,7801],{},"Reverse proxy\u002Fgateway modifying response headers.",[138,7803,7804,7805,7807],{},"Error-handling middleware returning ",[25,7806,1479],{}," for all errors.",[105,7809,7686],{"id":7810},"debugging-steps-1",[530,7812,7813,7818,7821],{},[138,7814,7701,7815,7817],{},[25,7816,7430],{}," in the Network panel.",[138,7819,7820],{},"Compare response headers between working and failing endpoints.",[138,7822,7823,7824,7826],{},"Inspect backend code\u002Fconfiguration for explicit ",[25,7825,7430],{}," settings.",[105,7828,7732],{"id":7829},"solutions-1",[135,7831,7832,7842],{},[138,7833,7834,7835,7837,7838,7841],{},"On the backend, consistently return ",[25,7836,747],{}," and encode the body as UTF-8. Many frameworks also emit ",[25,7839,7840],{},"application\u002Fjson; charset=utf-8","; the important part is that the response body is actually valid JSON and uses a consistent UTF-8 encoding.",[138,7843,7844,7845,7847,7848,7850],{},"On the frontend, be cautious when parsing responses whose ",[25,7846,7430],{}," is not ",[25,7849,2285],{},", or at least log them first.",[2172,7852],{},[71,7854,7856],{"id":7855},"scenario-3-trailing-commas-single-quotes-comments-fake-json","Scenario 3: Trailing Commas \u002F Single Quotes \u002F Comments (\"Fake JSON\")",[105,7858,7644],{"id":7859},"symptoms-2",[135,7861,7862,7865],{},[138,7863,7864],{},"You copy \"JSON-like\" content from logs, docs, or chat tools.",[138,7866,7867,7868],{},"Parsing it in code or tools fails with:\n",[135,7869,7870,7875,7880],{},[138,7871,7872],{},[25,7873,7874],{},"Unexpected token ','",[138,7876,7877],{},[25,7878,7879],{},"Unexpected token ':'",[138,7881,7882],{},[25,7883,7884],{},"Unexpected token '\u002F'",[105,7886,7888],{"id":7887},"common-error-patterns","Common Error Patterns",[530,7890,7891,7901,7912],{},[138,7892,7893,7895],{},[32,7894,3871],{},[17,7896,7899],{"className":7897,"code":7898,"language":1354,"meta":23},[1352],"{\n  \"name\": \"Alice\",\n  \"age\": 30,\n}\n",[25,7900,7898],{"__ignoreMap":23},[138,7902,7903,7906],{},[32,7904,7905],{},"Single quotes",[17,7907,7910],{"className":7908,"code":7909,"language":1354,"meta":23},[1352],"{\n  'name': 'Alice'\n}\n",[25,7911,7909],{"__ignoreMap":23},[138,7913,7914,7916],{},[32,7915,1562],{},[17,7917,7920],{"className":7918,"code":7919,"language":1354,"meta":23},[1352],"{\n  \u002F\u002F user info\n  \"name\": \"Alice\"\n}\n",[25,7921,7919],{"__ignoreMap":23},[105,7923,7686],{"id":7924},"debugging-steps-2",[530,7926,7927,7932,7935],{},[138,7928,7929,7930,69],{},"Paste the raw response\u002Ftext into the ",[57,7931,714],{"href":713},[138,7933,7934],{},"Let the tool auto-format and highlight error positions.",[138,7936,7937],{},"Fix according to the hints: remove trailing commas, switch to double quotes, delete comments.",[105,7939,7732],{"id":7940},"solutions-2",[135,7942,7943,7946],{},[138,7944,7945],{},"Always run \"JSON from docs\u002Flogs\" through a validator first.",[138,7947,7948],{},"If you need \"config with comments\" in backend logs, use JSONC or YAML and clearly label it as \"non-standard JSON\".",[2172,7950],{},[71,7952,7954],{"id":7953},"scenario-4-backend-returns-double-serialized-json-strings","Scenario 4: Backend Returns \"Double-Serialized\" JSON Strings",[105,7956,7644],{"id":7957},"symptoms-3",[135,7959,7960,7969,7978],{},[138,7961,7962,7963],{},"The response body is a string that contains JSON as text, e.g.:\n",[17,7964,7967],{"className":7965,"code":7966,"language":1354,"meta":23},[1352],"\"{\\\"key\\\":\\\"value\\\"}\"\n",[25,7968,7966],{"__ignoreMap":23},[138,7970,7971,7972,7974,7975,7977],{},"The frontend calls ",[25,7973,634],{}," once and gets a string, not an object; only a second ",[25,7976,634],{}," yields the object.",[138,7979,7980],{},"If your code assumes \"one parse gives an object\", it breaks.",[105,7982,7791],{"id":7983},"causes-1",[135,7985,7986,7993],{},[138,7987,7988,7989,7992],{},"The backend calls ",[25,7990,7991],{},"JSON.stringify"," on data that is already a JSON string.",[138,7994,7995],{},"Or an extra layer of wrapping happens in logs\u002Fmessage queues.",[105,7997,7686],{"id":7998},"debugging-steps-3",[530,8000,8001,8018],{},[138,8002,8003,8004],{},"Inspect the raw response in the Network panel:\n",[135,8005,8006,8011],{},[138,8007,8008,8009,3230],{},"Does it start and end with ",[25,8010,272],{},[138,8012,8013,8014,8017],{},"Does it contain many ",[25,8015,8016],{},"\\\""," inside?",[138,8019,8020,8021,8027],{},"In the console:\n",[17,8022,8025],{"className":8023,"code":8024,"language":94,"meta":23},[92],"const once = JSON.parse(text);\nconsole.log(typeof once, once);\n",[25,8026,8024],{"__ignoreMap":23},[135,8028,8029],{},[138,8030,8031,8032,8035],{},"If ",[25,8033,8034],{},"typeof once === 'string'",", it's double-serialized.",[105,8037,7732],{"id":8038},"solutions-3",[135,8040,8041,8046],{},[138,8042,8043,8044,7992],{},"On the backend, avoid calling ",[25,8045,7991],{},[138,8047,8048,8049,8051,8052,8058],{},"If you must support such an interface on the frontend, parse the outer layer first and explicitly verify the result is a string before parsing again. Do not blindly call ",[25,8050,634],{}," twice on every response — fix the API contract whenever possible:\n",[17,8053,8056],{"className":8054,"code":8055,"language":5751,"meta":23},[5749],"export function parsePossiblyDoubleEncodedJson(text: string): unknown {\n  const first = JSON.parse(text)\n  if (typeof first !== 'string') {\n    return first\n  }\n  return JSON.parse(first)\n}\n",[25,8057,8055],{"__ignoreMap":23},"\nUse this only when your API contract explicitly documents double encoding. Otherwise, treat it as a backend contract bug.",[2172,8060],{},[71,8062,8064],{"id":8063},"scenario-5-large-json-causing-timeouts-memory-issues","Scenario 5: Large JSON Causing Timeouts \u002F Memory Issues",[28,8066,8067],{},"A large payload is often valid JSON. The failure is usually a performance, memory, or transport problem — not a JSON syntax error.",[105,8069,7644],{"id":8070},"symptoms-4",[135,8072,8073,8076],{},[138,8074,8075],{},"The API returns a very large JSON (several MB or more).",[138,8077,8078,8079,6861,8081],{},"When the frontend calls ",[25,8080,634],{},[135,8082,8083,8086],{},[138,8084,8085],{},"The page freezes or even crashes;",[138,8087,8088,8089,5899,8092,8095],{},"Or you get ",[25,8090,8091],{},"Out of memory",[25,8093,8094],{},"Invalid argument"," errors in some environments.",[105,8097,7791],{"id":8098},"causes-2",[135,8100,8101,8104],{},[138,8102,8103],{},"Parsing huge JSON in one go puts heavy pressure on the main thread and memory.",[138,8105,8106,8107,8109],{},"Some environments (old browsers, low-end devices) have limits on single ",[25,8108,634],{}," calls.",[105,8111,7686],{"id":8112},"debugging-steps-4",[530,8114,8115,8123],{},[138,8116,8117,8118,5899,8120,5650],{},"Check the response size in the Network panel (",[25,8119,5189],{},[25,8121,8122],{},"Transferred",[138,8124,8125],{},"Try opening the JSON file locally in an editor to see if it's similarly slow.",[105,8127,7732],{"id":8128},"solutions-4",[135,8130,8131,8142],{},[138,8132,8133,8134],{},"On the backend:\n",[135,8135,8136,8139],{},[138,8137,8138],{},"Use pagination or cursor-based pagination for large lists;",[138,8140,8141],{},"Return only necessary fields to reduce payload size.",[138,8143,8144,8145],{},"On the frontend:\n",[135,8146,8147,8150],{},[138,8148,8149],{},"Use lazy loading \u002F virtual lists for large datasets;",[138,8151,8152],{},"Where possible, use streaming parsing (e.g., JSON stream libraries in Node.js).",[2172,8154],{},[71,8156,8158],{"id":8157},"scenario-6-encoding-issues-non-utf-8-bom","Scenario 6: Encoding Issues (Non-UTF-8, BOM)",[105,8160,7644],{"id":8161},"symptoms-5",[135,8163,8164,8167],{},[138,8165,8166],{},"The response fails to parse in some environments with vague errors.",[138,8168,8169,8170,8173],{},"Opening the text in an editor reveals a BOM (",[25,8171,8172],{},"EF BB BF",") or non-UTF-8 encoding.",[105,8175,7791],{"id":8176},"causes-3",[135,8178,8179,8182],{},[138,8180,8181],{},"Some backends\u002Fproxies output UTF-8 with BOM or other encodings.",[138,8183,8184],{},"For JSON exchanged between systems, UTF-8 is the required interoperable encoding. Producers must not add a byte order mark (BOM); parsers may choose whether to ignore one, so BOM-prefixed JSON can fail in strict parsers.",[105,8186,7686],{"id":8187},"debugging-steps-5",[530,8189,8190,8193],{},[138,8191,8192],{},"Save the response as a file and open it in an editor that shows encoding (e.g., VS Code, Notepad++).",[138,8194,8195],{},"Check for a BOM or non-UTF-8 encoding.",[105,8197,7732],{"id":8198},"solutions-5",[135,8200,8201,8204,8207],{},[138,8202,8203],{},"Ensure the backend outputs JSON as UTF-8 without BOM.",[138,8205,8206],{},"Configure gateways\u002Fproxies not to add BOM or change encoding.",[138,8208,8209,8210,8213],{},"In browser Fetch scenarios, the decoding chain handles some BOM cases, but the real issue may be: the server outputting non-UTF-8, the file content entering JavaScript string as ",[25,8211,8212],{},"U+FEFF",", proxy\u002Ftranscoding corruption, unescaped control characters in JSON strings, or incorrect text decoding. Don't attribute all \"vague parse errors\" to BOM.",[2172,8215],{},[71,8217,8219],{"id":8218},"scenario-7-truncated-json-network-interruption-timeout","Scenario 7: Truncated JSON (Network Interruption \u002F Timeout)",[105,8221,7644],{"id":8222},"symptoms-6",[135,8224,8225,8228],{},[138,8226,8227],{},"The response is cut off during transmission.",[138,8229,8230,8231],{},"Errors like:\n",[48,8232,8233],{},[28,8234,8235],{},[25,8236,8237],{},"SyntaxError: Unexpected end of JSON input",[105,8239,7791],{"id":8240},"causes-4",[135,8242,8243],{},[138,8244,8245],{},"Unstable network, timeouts, or proxy interruptions truncate the JSON.",[105,8247,7686],{"id":8248},"debugging-steps-6",[530,8250,8251,8269],{},[138,8252,8253,8254],{},"Check the request status in the Network panel:\n",[135,8255,8256],{},[138,8257,8258,8259,265,8262,265,8265,8268],{},"Does it show ",[25,8260,8261],{},"(failed)",[25,8263,8264],{},"timeout",[25,8266,8267],{},"aborted",", etc.?",[138,8270,8271,8272,223,8274,5650],{},"Inspect whether the response content is clearly truncated (e.g., last character is not ",[25,8273,41],{},[25,8275,268],{},[105,8277,7732],{"id":8278},"solutions-6",[135,8280,8281,8284],{},[138,8282,8283],{},"Add retry logic on the frontend, especially for mobile\u002Funstable networks.",[138,8285,8286],{},"Optimize timeout and retry settings on the backend\u002Fops side.",[2172,8288],{},[71,8290,8292],{"id":8291},"scenario-8-extra-text-mixed-in-prefixsuffix-garbage","Scenario 8: Extra Text Mixed In (Prefix\u002FSuffix Garbage)",[105,8294,7644],{"id":8295},"symptoms-7",[135,8297,8298,8314],{},[138,8299,8300,8301,8307,8308],{},"The response has extra text before or after the JSON, e.g.:\n",[17,8302,8305],{"className":8303,"code":8304,"language":22,"meta":23},[20],"Data: {\"key\":\"value\"}\n",[25,8306,8304],{"__ignoreMap":23},"\nor\n",[17,8309,8312],{"className":8310,"code":8311,"language":22,"meta":23},[20],"{\"key\":\"value\"}---END---\n",[25,8313,8311],{"__ignoreMap":23},[138,8315,8316,8317,8319],{},"Calling ",[25,8318,634],{}," on the entire string fails.",[105,8321,7791],{"id":8322},"causes-5",[135,8324,8325,8328],{},[138,8326,8327],{},"Some legacy systems\u002Fdebug logic append extra text to responses.",[138,8329,8330],{},"Logs\u002Fproxies add prefixes\u002Fsuffixes.",[105,8332,7686],{"id":8333},"debugging-steps-7",[530,8335,8336,8339],{},[138,8337,8338],{},"Inspect the full response text in the Network panel.",[138,8340,8341],{},"Confirm whether there are extra characters before\u002Fafter the JSON.",[105,8343,7732],{"id":8344},"solutions-7",[135,8346,8347,8350,8360],{},[138,8348,8349],{},"Fix at the source if possible: ensure responses are pure JSON.",[138,8351,8352,8355,8356,8359],{},[32,8353,8354],{},"Do not use a regex to extract arbitrary JSON from a mixed response in production."," JSON is nested and strings can contain braces, so a simple regular expression cannot reliably identify the intended JSON value. Problems include: top-level arrays ",[25,8357,8358],{},"[]",", braces inside string fields, multiple JSON fragments, greedy matching, and masking of protocol-layer bugs.",[138,8361,8362,8363],{},"Reliable alternatives:\n",[530,8364,8365,8368,8371,8374,8380],{},[138,8366,8367],{},"Fix the API so the response body is always pure JSON.",[138,8369,8370],{},"Design separate endpoints for different content types.",[138,8372,8373],{},"If the protocol uses a known wrapper format (SSE, NDJSON, JSONP, specific log format), use the corresponding parser.",[138,8375,8376,8377,8379],{},"For ad-hoc debugging, copy the raw content into the ",[57,8378,714],{"href":713}," and manually identify the JSON boundaries.",[138,8381,8382],{},"Log limited, sanitized response fragments in code — don't guess JSON boundaries.",[2172,8384],{},[71,8386,8388],{"id":8387},"scenario-9-backend-returns-half-json-half-text-mixed-content","Scenario 9: Backend Returns \"Half JSON, Half Text\" Mixed Content",[105,8390,7644],{"id":8391},"symptoms-8",[135,8393,8394,8403],{},[138,8395,8396,8397],{},"The first part of the response is JSON, the rest is plain text or HTML, e.g.:\n",[17,8398,8401],{"className":8399,"code":8400,"language":22,"meta":23},[20],"{\"success\":true}\n\u003Cscript>...\u003C\u002Fscript>\n",[25,8402,8400],{"__ignoreMap":23},[138,8404,8405,8407],{},[25,8406,634],{}," fails when it encounters the non-JSON part.",[105,8409,7791],{"id":8410},"causes-6",[135,8412,8413,8416],{},[138,8414,8415],{},"Error-handling logic outputs HTML\u002Fscripts after writing JSON.",[138,8417,8418],{},"Some frameworks append debug info on exceptions.",[105,8420,7686],{"id":8421},"debugging-steps-8",[530,8423,8424,8427],{},[138,8425,8426],{},"Inspect the full response text to see if there's content after the JSON.",[138,8428,8429],{},"Check backend logs for exception stacks being written to the response.",[105,8431,7732],{"id":8432},"solutions-8",[135,8434,8435,8438],{},[138,8436,8437],{},"Ensure each response is either pure JSON or pure HTML, not mixed.",[138,8439,8440,8441,8443],{},"For error responses, use a consistent JSON structure (e.g., ",[25,8442,6661],{}," field) and avoid appending HTML.",[2172,8445],{},[71,8447,8449,8450],{"id":8448},"scenario-10-unvalidated-user-input-or-third-party-data-passed-to-jsonparse","Scenario 10: Unvalidated User Input or Third-Party Data Passed to ",[25,8451,634],{},[105,8453,7644],{"id":8454},"symptoms-9",[135,8456,8457,8463],{},[138,8458,8459,8460,8462],{},"Frontend\u002Fbackend directly calls ",[25,8461,634],{}," on user input, third-party webhooks, or queue messages.",[138,8464,8465],{},"When the data is invalid, it throws exceptions and can break the entire request flow.",[105,8467,7791],{"id":8468},"causes-7",[135,8470,8471,8474],{},[138,8472,8473],{},"Missing pre-validation: length, character set, structure, etc.",[138,8475,8476],{},"Assuming \"the other party will always send valid JSON\".",[105,8478,7686],{"id":8479},"debugging-steps-9",[530,8481,8482,8498],{},[138,8483,8484,8485,8487,8488],{},"Review all ",[25,8486,634],{}," call sites in your code:\n",[135,8489,8490,8493],{},[138,8491,8492],{},"Is the data source trusted?",[138,8494,8495,8496,3230],{},"Is it wrapped in ",[25,8497,7100],{},[138,8499,8500,8501,8503],{},"For failing samples, paste them into the ",[57,8502,714],{"href":713}," to see specific errors.",[105,8505,7732],{"id":8506},"solutions-9",[135,8508,8509,8534],{},[138,8510,8511,8512],{},"For all external input:\n",[135,8513,8514,8517,8520,8523,8528,8531],{},[138,8515,8516],{},"Set a realistic byte-size limit before parsing untrusted input (e.g., max 1MB).",[138,8518,8519],{},"Decode input as UTF-8.",[138,8521,8522],{},"Reject malformed encoding where your platform exposes decoding errors.",[138,8524,8525,8526,69],{},"Parse inside ",[25,8527,7100],{},[138,8529,8530],{},"Validate the parsed value against a schema or application rules.",[138,8532,8533],{},"Avoid logging full untrusted payloads, especially if they may contain secrets.",[138,8535,8536,8537,223,8540,69],{},"JSON allows Unicode strings — don't restrict to \"printable ASCII\" only, as that would reject valid international data like ",[25,8538,8539],{},"\"São Paulo\"",[25,8541,8542],{},"\"日本語\"",[28,8544,8545,8546,8549],{},"Once text can be parsed successfully, syntax validation is only the first step. Use ",[57,8547,8548],{"href":2938},"JSON Schema validation to check required fields, data types, and allowed values"," before accepting the data in your application.",[2172,8551],{},[71,8553,8555],{"id":8554},"troubleshooting-checklist-worth-bookmarking","Troubleshooting Checklist (Worth Bookmarking)",[28,8557,8558],{},"When you hit a \"JSON parse failed\" error, troubleshoot in this order:",[530,8560,8561,8567,8575,8588,8594,8607,8613,8619],{},[138,8562,8563,8566],{},[32,8564,8565],{},"Check status code",": is it 2xx?",[138,8568,8569,8572,8573,3230],{},[32,8570,8571],{},"Check Content-Type",": is it ",[25,8574,2285],{},[138,8576,8577,6861,8580],{},[32,8578,8579],{},"Inspect response content",[135,8581,8582,8585],{},[138,8583,8584],{},"Is it pure JSON, or HTML\u002Ftext?",[138,8586,8587],{},"Are there extra characters before\u002Fafter?",[138,8589,8590,8593],{},[32,8591,8592],{},"Check size",": is it unusually large (several MB+)?",[138,8595,8596,6861,8599],{},[32,8597,8598],{},"Validate with a tool",[135,8600,8601],{},[138,8602,8603,8604,8606],{},"Paste the response into the ",[57,8605,714],{"href":713}," to automatically check syntax errors.",[138,8608,8609,8612],{},[32,8610,8611],{},"Check encoding",": is there a BOM or non-UTF-8 encoding?",[138,8614,8615,8618],{},[32,8616,8617],{},"Check logs",": does the backend log show exception stacks written to the response?",[138,8620,8621,6861,8624],{},[32,8622,8623],{},"Check code",[135,8625,8626,8634],{},[138,8627,8628,8629,8631,8632,3230],{},"Is ",[25,8630,634],{}," wrapped in ",[25,8633,7100],{},[138,8635,8636],{},"Are you trying to parse non-2xx responses?",[2172,8638],{},[71,8640,8642],{"id":8641},"how-to-prevent-json-parse-failures","How to Prevent JSON Parse Failures?",[530,8644,8645,8667,8697,8720],{},[138,8646,8647,8650],{},[32,8648,8649],{},"Standardize API Contracts",[135,8651,8652,8658,8664],{},[138,8653,8654,8655],{},"Success response: ",[25,8656,8657],{},"{ \"success\": true, \"data\": {...} }",[138,8659,8660,8661],{},"Error response: ",[25,8662,8663],{},"{ \"success\": false, \"error\": { \"code\": \"...\", \"message\": \"...\" } }",[138,8665,8666],{},"All responses are pure JSON, with no extra text.",[138,8668,8669,8672],{},[32,8670,8671],{},"Unified Parsing Logic on the Frontend",[135,8673,8674,8694],{},[138,8675,8676,8677,8680,8681],{},"Encapsulate a ",[25,8678,8679],{},"fetchJson"," utility:\n",[135,8682,8683,8685,8689],{},[138,8684,8565],{},[138,8686,7701,8687],{},[25,8688,7430],{},[138,8690,8691,8692],{},"Then call ",[25,8693,634],{},[138,8695,8696],{},"Route all API calls through this function to reduce repeated mistakes.",[138,8698,8699,8702],{},[32,8700,8701],{},"Logging and Monitoring",[135,8703,8704,8717],{},[138,8705,8706,8707],{},"For failed parses, log:\n",[135,8708,8709,8712,8714],{},[138,8710,8711],{},"Status code",[138,8713,7430],{},[138,8715,8716],{},"First 1KB of the response (sanitized)",[138,8718,8719],{},"This makes it easier to tell whether it's a backend or network issue.",[138,8721,8722,8725],{},[32,8723,8724],{},"Use Tools Effectively",[135,8726,8727,8744],{},[138,8728,8729,8730],{},"During development:\n",[135,8731,8732,8738],{},[138,8733,8734,8735,8737],{},"Use the ",[57,8736,714],{"href":713}," to quickly validate API responses.",[138,8739,8740,8743],{},[57,8741,8742],{"href":713},"Format complex structures"," before reading them.",[138,8745,8746,8747],{},"For production issues:\n",[135,8748,8749],{},[138,8750,8751],{},"Paste problematic samples into the editor to quickly locate syntax errors.",[2172,8753],{},[71,8755,7485],{"id":7484},[135,8757,8758,8761,8764],{},[138,8759,8760],{},"\"JSON parse failed\" can have many causes: HTML error pages, format errors, encoding issues, truncated responses, double serialization, and more.",[138,8762,8763],{},"A systematic troubleshooting flow (status code → Content-Type → response content → tool validation) can significantly reduce debugging time.",[138,8765,8766],{},"In the long run, standardizing API contracts, encapsulating parsing logic, and using validation tools are key to minimizing these issues.",[48,8768,8769],{},[28,8770,8771,8772,8774],{},"Next time you hit a JSON parse error, try pasting the response into the ",[57,8773,714],{"href":713}," first to quickly confirm whether it's a syntax issue, then decide whether to fix it on the frontend or escalate to backend debugging.",[71,8776,916],{"id":915},[135,8778,8779,8785,8791],{},[138,8780,8781,8782,69],{},"Once the text can be parsed, syntax validation is only the first layer. Learn how to use ",[57,8783,8784],{"href":2938},"JSON Schema validation to check structure, required fields, and data types",[138,8786,8787,8788,69],{},"For a foundational overview of JSON structure and syntax rules, see ",[57,8789,8790],{"href":2339},"What Is JSON?",[138,8792,8793,8794,69],{},"For API design patterns and response structure best practices, see ",[57,8795,8796],{"href":4418},"JSON Best Practices",{"title":23,"searchDepth":959,"depth":959,"links":8798},[8799,8800,8806,8813,8819,8825,8831,8837,8843,8849,8855,8862,8863,8864,8865],{"id":7593,"depth":959,"text":7594},{"id":7639,"depth":959,"text":7640,"children":8801},[8802,8803,8804,8805],{"id":7643,"depth":964,"text":7644},{"id":7668,"depth":964,"text":173},{"id":7685,"depth":964,"text":7686},{"id":7731,"depth":964,"text":7732},{"id":7765,"depth":959,"text":8807,"children":8808},"Scenario 2: Content-Type Is Not application\u002Fjson",[8809,8810,8811,8812],{"id":7771,"depth":964,"text":7644},{"id":7790,"depth":964,"text":7791},{"id":7810,"depth":964,"text":7686},{"id":7829,"depth":964,"text":7732},{"id":7855,"depth":959,"text":7856,"children":8814},[8815,8816,8817,8818],{"id":7859,"depth":964,"text":7644},{"id":7887,"depth":964,"text":7888},{"id":7924,"depth":964,"text":7686},{"id":7940,"depth":964,"text":7732},{"id":7953,"depth":959,"text":7954,"children":8820},[8821,8822,8823,8824],{"id":7957,"depth":964,"text":7644},{"id":7983,"depth":964,"text":7791},{"id":7998,"depth":964,"text":7686},{"id":8038,"depth":964,"text":7732},{"id":8063,"depth":959,"text":8064,"children":8826},[8827,8828,8829,8830],{"id":8070,"depth":964,"text":7644},{"id":8098,"depth":964,"text":7791},{"id":8112,"depth":964,"text":7686},{"id":8128,"depth":964,"text":7732},{"id":8157,"depth":959,"text":8158,"children":8832},[8833,8834,8835,8836],{"id":8161,"depth":964,"text":7644},{"id":8176,"depth":964,"text":7791},{"id":8187,"depth":964,"text":7686},{"id":8198,"depth":964,"text":7732},{"id":8218,"depth":959,"text":8219,"children":8838},[8839,8840,8841,8842],{"id":8222,"depth":964,"text":7644},{"id":8240,"depth":964,"text":7791},{"id":8248,"depth":964,"text":7686},{"id":8278,"depth":964,"text":7732},{"id":8291,"depth":959,"text":8292,"children":8844},[8845,8846,8847,8848],{"id":8295,"depth":964,"text":7644},{"id":8322,"depth":964,"text":7791},{"id":8333,"depth":964,"text":7686},{"id":8344,"depth":964,"text":7732},{"id":8387,"depth":959,"text":8388,"children":8850},[8851,8852,8853,8854],{"id":8391,"depth":964,"text":7644},{"id":8410,"depth":964,"text":7791},{"id":8421,"depth":964,"text":7686},{"id":8432,"depth":964,"text":7732},{"id":8448,"depth":959,"text":8856,"children":8857},"Scenario 10: Unvalidated User Input or Third-Party Data Passed to JSON.parse",[8858,8859,8860,8861],{"id":8454,"depth":964,"text":7644},{"id":8468,"depth":964,"text":7791},{"id":8479,"depth":964,"text":7686},{"id":8506,"depth":964,"text":7732},{"id":8554,"depth":959,"text":8555},{"id":8641,"depth":959,"text":8642},{"id":7484,"depth":959,"text":7485},{"id":915,"depth":959,"text":916},"2026-08-24T00:00:00.000Z","A practical guide to debugging JSON parse errors in real APIs, covering typical error messages, root causes, and step-by-step troubleshooting.","\u002Fblog\u002Fcover\u002Fen\u002Fjson-parse-error-debug-cover.svg",[998,7553],{},"\u002Fen\u002Fblog\u002Fjson-parse-error-debug",{"slug":2220,"text":8873,"btn":2222},"🚀 Validate your JSON first:",{"title":68,"description":8867},"en\u002Fblog\u002Fjson-parse-error-debug",[1009,714,8877,8878,8879,634],"JSON Validator","API Debugging","Error Handling","IRM6Gkn-n4JrWkRL1W1vrEVS6vc0ryQO55leFG2MLTc",{"id":8882,"title":8883,"author":7,"body":8884,"category":991,"date":9757,"description":9758,"draft":994,"extension":995,"h1":5530,"image":9759,"lastmod":9757,"locales":9760,"meta":9761,"navigation":1000,"path":9762,"promo":9763,"seo":9765,"stem":9766,"tags":9767,"__hash__":9769},"blog\u002Fen\u002Fblog\u002Fwhat-is-json.md","What Is JSON? Structure, Syntax, and Common Mistakes (2026 Developer Guide)",{"type":9,"value":8885,"toc":9725},[8886,8901,8905,8908,8939,8942,8946,8949,8997,9012,9016,9020,9026,9029,9050,9054,9060,9063,9067,9073,9082,9086,9089,9110,9116,9119,9131,9137,9141,9165,9171,9175,9181,9185,9188,9192,9195,9201,9204,9211,9214,9220,9226,9230,9232,9237,9240,9246,9249,9256,9258,9264,9270,9275,9279,9281,9287,9289,9295,9297,9303,9306,9311,9319,9326,9328,9334,9336,9342,9344,9350,9357,9361,9363,9369,9371,9377,9379,9386,9388,9394,9400,9408,9412,9415,9425,9427,9433,9442,9445,9464,9467,9480,9484,9488,9491,9502,9505,9512,9516,9522,9525,9529,9532,9538,9541,9555,9559,9562,9632,9638,9642,9701,9709,9711],[28,8887,8888,8889,953,8891,8893,8894,8896,8897,8900],{},"JSON (JavaScript Object Notation) is a lightweight data interchange format that appears in almost every modern web development and API design scenario: from browser–backend communication to configuration files like ",[25,8890,2302],{},[25,8892,2305],{},", and even structured logs and message queues.",[7576,8895],{},"\nInstead of a textbook-style introduction, this guide focuses on ",[32,8898,8899],{},"real-world developer scenarios",", explaining JSON structure and syntax while diving deep into the mistakes you're most likely to encounter and how to debug them.",[71,8902,8904],{"id":8903},"why-developers-must-understand-json","Why Developers Must Understand JSON",[28,8906,8907],{},"In modern web development, JSON is everywhere:",[135,8909,8910,8916,8927,8933],{},[138,8911,8912,8915],{},[32,8913,8914],{},"Frontend–backend communication",": RESTful APIs and most GraphQL services use JSON for request\u002Fresponse bodies.",[138,8917,8918,1611,8921,8923,8924,8926],{},[32,8919,8920],{},"Configuration files",[25,8922,2302],{}," in Node.js projects, ",[25,8925,2305],{}," in TypeScript, and many other config files are JSON or JSON supersets.",[138,8928,8929,8932],{},[32,8930,8931],{},"Logging and monitoring",": Many logging systems (e.g., ELK, Cloudflare Logs) store structured logs in JSON format.",[138,8934,8935,8938],{},[32,8936,8937],{},"Third-party integrations",": Payment, SMS, email, analytics SDKs typically return or accept JSON.",[28,8940,8941],{},"Not understanding JSON's strict syntax rules can waste a lot of time when debugging APIs, parsing responses, or handling configuration.",[71,8943,8945],{"id":8944},"json-data-types-more-than-just-objects-and-arrays","JSON Data Types: More Than Just \"Objects and Arrays\"",[28,8947,8948],{},"JSON supports only a limited set of data types, which is why it's simple and easy to parse:",[135,8950,8951,8960,8968,8976,8982,8991],{},[138,8952,8953,8956,8957,69],{},[32,8954,8955],{},"Object",": A collection of key–value pairs, wrapped in ",[25,8958,8959],{},"{}",[138,8961,8962,8965,8966,69],{},[32,8963,8964],{},"Array",": An ordered list, wrapped in ",[25,8967,8358],{},[138,8969,8970,8973,8974,69],{},[32,8971,8972],{},"String",": Must be wrapped in double quotes ",[25,8975,272],{},[138,8977,8978,8981],{},[32,8979,8980],{},"Number",": Integer or floating-point; hexadecimal and octal are not allowed.",[138,8983,8984,1611,8987,223,8989,69],{},[32,8985,8986],{},"Boolean",[25,8988,6229],{},[25,8990,5971],{},[138,8992,8993,8996],{},[32,8994,8995],{},"Null",": Represents \"no value\".",[28,8998,8999,9000,9002,9003,9005,9006,9008,9009,69],{},"JSON does ",[32,9001,333],{}," support functions, Date objects, regular expressions, ",[25,9004,313],{},", comments, etc.",[7576,9007],{},"\nIn real projects, dates are usually represented as ISO 8601 strings, e.g. ",[25,9010,9011],{},"\"2026-08-23T08:00:00Z\"",[71,9013,9015],{"id":9014},"what-does-json-look-like-in-real-apis","What Does JSON Look Like in Real APIs?",[105,9017,9019],{"id":9018},"typical-rest-api-response","Typical REST API Response",[17,9021,9024],{"className":9022,"code":9023,"language":1354,"meta":23},[1352],"{\n  \"success\": true,\n  \"data\": {\n    \"id\": 12345,\n    \"name\": \"Alice\",\n    \"email\": \"alice@example.com\",\n    \"roles\": [\"user\", \"editor\"],\n    \"createdAt\": \"2026-08-23T08:00:00Z\"\n  },\n  \"meta\": {\n    \"requestId\": \"req_abc123\",\n    \"version\": \"v1\"\n  }\n}\n",[25,9025,9023],{"__ignoreMap":23},[28,9027,9028],{},"Characteristics:",[135,9030,9031,9041,9044],{},[138,9032,9033,9034,265,9036,265,9038,9040],{},"The top level is an object, making it easy to extend (",[25,9035,6651],{},[25,9037,6658],{},[25,9039,6670],{},", etc.).",[138,9042,9043],{},"Nested objects and arrays express complex structures.",[138,9045,9046,9047,69],{},"Dates are represented as strings, not ",[25,9048,9049],{},"new Date()",[105,9051,9053],{"id":9052},"list-endpoint-paginated","List Endpoint (Paginated)",[17,9055,9058],{"className":9056,"code":9057,"language":1354,"meta":23},[1352],"{\n  \"success\": true,\n  \"data\": [\n    { \"id\": 1, \"title\": \"JSON Guide\" },\n    { \"id\": 2, \"title\": \"API Design Tips\" }\n  ],\n  \"pagination\": {\n    \"page\": 1,\n    \"pageSize\": 20,\n    \"total\": 58\n  }\n}\n",[25,9059,9057],{"__ignoreMap":23},[28,9061,9062],{},"This pattern is very common in admin dashboards and content listings.",[105,9064,9066],{"id":9065},"error-response-often-overlooked","Error Response (Often Overlooked)",[17,9068,9071],{"className":9069,"code":9070,"language":1354,"meta":23},[1352],"{\n  \"success\": false,\n  \"error\": {\n    \"code\": \"INVALID_JSON\",\n    \"message\": \"Unexpected token ':' in JSON at position 3\",\n    \"details\": {\n      \"line\": 2,\n      \"column\": 5\n    }\n  }\n}\n",[25,9072,9070],{"__ignoreMap":23},[28,9074,9075,9076,9078,9079,9081],{},"When the backend fails to validate JSON, it often returns a structure like this. If the frontend blindly calls ",[25,9077,634],{}," on the raw response without checking the ",[25,9080,6651],{}," field, it can easily mishandle errors.",[71,9083,9085],{"id":9084},"json-syntax-rules-from-it-runs-to-strictly-correct","JSON Syntax Rules: From \"It Runs\" to \"Strictly Correct\"",[105,9087,8955],{"id":9088},"object",[135,9090,9091,9096,9103],{},[138,9092,9093,9094,69],{},"Wrapped in ",[25,9095,8959],{},[138,9097,9098,9099,9102],{},"Contains zero or more ",[25,9100,9101],{},"\"key\": value"," pairs, separated by commas.",[138,9104,9105,9106,9109],{},"Keys ",[32,9107,9108],{},"must"," be double-quoted strings.",[17,9111,9114],{"className":9112,"code":9113,"language":1354,"meta":23},[1352],"{\n  \"id\": 123,\n  \"name\": \"JSON Guide\",\n  \"active\": true,\n  \"meta\": null\n}\n",[25,9115,9113],{"__ignoreMap":23},[105,9117,8964],{"id":9118},"array",[135,9120,9121,9125,9128],{},[138,9122,9093,9123,69],{},[25,9124,8358],{},[138,9126,9127],{},"Contains zero or more values, separated by commas.",[138,9129,9130],{},"Values can be any valid JSON value, and types can be mixed.",[17,9132,9135],{"className":9133,"code":9134,"language":1354,"meta":23},[1352],"[\n  \"apple\",\n  42,\n  true,\n  { \"key\": \"value\" },\n[1][2][3]\n]\n",[25,9136,9134],{"__ignoreMap":23},[105,9138,9140],{"id":9139},"strings-and-escaping","Strings and Escaping",[135,9142,9143,9148],{},[138,9144,9145,9146,69],{},"Must use double quotes ",[25,9147,272],{},[138,9149,9150,9151,265,9153,265,9156,265,9159,265,9162,69],{},"Common escapes: ",[25,9152,8016],{},[25,9154,9155],{},"\\\\",[25,9157,9158],{},"\\n",[25,9160,9161],{},"\\t",[25,9163,9164],{},"\\uXXXX",[17,9166,9169],{"className":9167,"code":9168,"language":1354,"meta":23},[1352],"{\n  \"message\": \"He said \\\"hello\\\"\",\n  \"path\": \"C:\\\\Users\\\\Alice\",\n  \"multiline\": \"Line1\\nLine2\"\n}\n",[25,9170,9168],{"__ignoreMap":23},[105,9172,9174],{"id":9173},"numbers-booleans-and-null","Numbers, Booleans, and Null",[17,9176,9179],{"className":9177,"code":9178,"language":1354,"meta":23},[1352],"{\n  \"int\": 10,\n  \"float\": 3.14,\n  \"negative\": -0.5,\n  \"exp\": 1.23e10,\n  \"enabled\": true,\n  \"deleted\": false,\n  \"optional\": null\n}\n",[25,9180,9178],{"__ignoreMap":23},[71,9182,9184],{"id":9183},"common-json-mistakes-from-error-messages-to-fixes","Common JSON Mistakes: From Error Messages to Fixes",[28,9186,9187],{},"Below are the most common JSON mistakes in real development, along with typical error messages and debugging strategies.",[105,9189,9191],{"id":9190},"using-single-quotes-or-unquoted-keys","Using Single Quotes or Unquoted Keys",[28,9193,9194],{},"Invalid:",[17,9196,9199],{"className":9197,"code":9198,"language":1354,"meta":23},[1352],"{\n  'name': 'Alice',\n  name: \"Alice\"\n}\n",[25,9200,9198],{"__ignoreMap":23},[28,9202,9203],{},"Typical error (browser \u002F Node.js):",[48,9205,9206],{},[28,9207,9208],{},[25,9209,9210],{},"SyntaxError: Unexpected token ':' in JSON at position 1",[28,9212,9213],{},"Fix:",[17,9215,9218],{"className":9216,"code":9217,"language":1354,"meta":23},[1352],"{\n  \"name\": \"Alice\"\n}\n",[25,9219,9217],{"__ignoreMap":23},[28,9221,9222,9225],{},[32,9223,9224],{},"Key point",": All strings in JSON, including keys, must be double-quoted.",[105,9227,9229],{"id":9228},"trailing-commas","Trailing Commas",[28,9231,9194],{},[17,9233,9235],{"className":9234,"code":7898,"language":1354,"meta":23},[1352],[25,9236,7898],{"__ignoreMap":23},[28,9238,9239],{},"or:",[17,9241,9244],{"className":9242,"code":9243,"language":1354,"meta":23},[1352],"[1, 2, 3,]\n",[25,9245,9243],{"__ignoreMap":23},[28,9247,9248],{},"Typical error:",[48,9250,9251],{},[28,9252,9253],{},[25,9254,9255],{},"SyntaxError: Unexpected token '}' in JSON at position 27",[28,9257,9213],{},[17,9259,9262],{"className":9260,"code":9261,"language":1354,"meta":23},[1352],"{\n  \"name\": \"Alice\",\n  \"age\": 30\n}\n",[25,9263,9261],{"__ignoreMap":23},[17,9265,9268],{"className":9266,"code":9267,"language":1354,"meta":23},[1352],"[1][2][3]\n",[25,9269,9267],{"__ignoreMap":23},[28,9271,9272,9274],{},[32,9273,9224],{},": JSON does not allow trailing commas after the last element.",[105,9276,9278],{"id":9277},"writing-comments-in-json","Writing Comments in JSON",[28,9280,9194],{},[17,9282,9285],{"className":9283,"code":9284,"language":1354,"meta":23},[1352],"{\n  \u002F\u002F User info\n  \"name\": \"Alice\",\n  \"age\": 30\n}\n",[25,9286,9284],{"__ignoreMap":23},[28,9288,9239],{},[17,9290,9293],{"className":9291,"code":9292,"language":1354,"meta":23},[1352],"{\n  \"name\": \"Alice\", \u002F* age *\u002F \"age\": 30\n}\n",[25,9294,9292],{"__ignoreMap":23},[28,9296,9248],{},[48,9298,9299],{},[28,9300,9301],{},[25,9302,7619],{},[28,9304,9305],{},"Fix: Remove all comments.",[17,9307,9309],{"className":9308,"code":9261,"language":1354,"meta":23},[1352],[25,9310,9261],{"__ignoreMap":23},[28,9312,9313,9315,9316,9318],{},[32,9314,9224],{},": Standard JSON does not support any form of comments.",[7576,9317],{},"\nIf you really need \"config with comments\", consider JSONC or YAML, but they are not standard JSON.",[105,9320,9322,9323,9325],{"id":9321},"using-invalid-values-undefined-functions-date-objects-etc","Using Invalid Values: ",[25,9324,313],{},", Functions, Date Objects, etc.",[28,9327,9194],{},[17,9329,9332],{"className":9330,"code":9331,"language":1354,"meta":23},[1352],"{\n  \"name\": \"Alice\",\n  \"created\": undefined,\n  \"handler\": function() {},\n  \"date\": new Date()\n}\n",[25,9333,9331],{"__ignoreMap":23},[28,9335,9248],{},[48,9337,9338],{},[28,9339,9340],{},[25,9341,7614],{},[28,9343,9213],{},[17,9345,9348],{"className":9346,"code":9347,"language":1354,"meta":23},[1352],"{\n  \"name\": \"Alice\",\n  \"created\": null,\n  \"handler\": null,\n  \"date\": \"2026-08-23T08:00:00Z\"\n}\n",[25,9349,9347],{"__ignoreMap":23},[28,9351,9352,9354,9355,69],{},[32,9353,9224],{},": JSON only supports objects, arrays, strings, numbers, booleans, and ",[25,9356,337],{},[105,9358,9360],{"id":9359},"unescaped-quotes-or-newlines-in-strings","Unescaped Quotes or Newlines in Strings",[28,9362,9194],{},[17,9364,9367],{"className":9365,"code":9366,"language":1354,"meta":23},[1352],"{\n  \"message\": \"He said \"hello\"\"\n}\n",[25,9368,9366],{"__ignoreMap":23},[28,9370,9239],{},[17,9372,9375],{"className":9373,"code":9374,"language":1354,"meta":23},[1352],"{\n  \"text\": \"Line1\nLine2\"\n}\n",[25,9376,9374],{"__ignoreMap":23},[28,9378,9248],{},[48,9380,9381],{},[28,9382,9383],{},[25,9384,9385],{},"SyntaxError: Unexpected token 'h' in JSON at position 15",[28,9387,9213],{},[17,9389,9392],{"className":9390,"code":9391,"language":1354,"meta":23},[1352],"{\n  \"message\": \"He said \\\"hello\\\"\"\n}\n",[25,9393,9391],{"__ignoreMap":23},[17,9395,9398],{"className":9396,"code":9397,"language":1354,"meta":23},[1352],"{\n  \"text\": \"Line1\\nLine2\"\n}\n",[25,9399,9397],{"__ignoreMap":23},[28,9401,9402,9404,9405,9407],{},[32,9403,9224],{},": Double quotes inside strings must be escaped as ",[25,9406,8016],{},", and control characters like newlines must use escape sequences.",[105,9409,9411],{"id":9410},"parsing-an-html-error-page-as-json","Parsing an HTML Error Page as JSON",[28,9413,9414],{},"Real-world scenario:",[135,9416,9417,9420],{},[138,9418,9419],{},"The server returns 500\u002F404 with an HTML error page as the body, not JSON.",[138,9421,7655,9422,9424],{},[25,9423,7658],{}," and fails.",[28,9426,9248],{},[48,9428,9429],{},[28,9430,9431],{},[25,9432,7609],{},[28,9434,9435,9436,9438,9439,9441],{},"Reason: HTML starts with ",[25,9437,7681],{}," (e.g. ",[25,9440,7674],{},"), which is not valid JSON.",[28,9443,9444],{},"Debugging steps:",[530,9446,9447,9454,9461],{},[138,9448,9449,9450,9453],{},"Open the browser's Network panel and inspect the ",[32,9451,9452],{},"Response"," of the request.",[138,9455,9456,9457,6116,9459,69],{},"Check whether the ",[25,9458,7430],{},[25,9460,2285],{},[138,9462,9463],{},"Verify that the status code is 2xx and that the body is actual JSON.",[28,9465,9466],{},"Solutions:",[135,9468,9469,9475],{},[138,9470,9471,9472,9474],{},"Before parsing, check ",[25,9473,7430],{}," and the status code.",[138,9476,9477,9478,69],{},"For non-2xx responses, prioritize reading error information instead of directly calling ",[25,9479,634],{},[71,9481,9483],{"id":9482},"how-to-quickly-check-if-json-is-valid","How to Quickly Check if JSON Is Valid?",[105,9485,9487],{"id":9486},"using-online-json-validation-and-formatting-tools","Using Online JSON Validation and Formatting Tools",[28,9489,9490],{},"Paste your JSON into an online tool to:",[135,9492,9493,9496,9499],{},[138,9494,9495],{},"Automatically check syntax errors and highlight the error location (line\u002Fcolumn).",[138,9497,9498],{},"One-click formatting (indentation, newlines) for easier reading and debugging.",[138,9500,9501],{},"Support minification to reduce payload size.",[28,9503,9504],{},"If you're using our tool site, you can paste any JSON directly into the JSON Editor on the homepage to instantly validate and format it.",[48,9506,9507],{},[28,9508,9509,9510],{},"🚀 Skip straight to formatting\u002Fvalidating your JSON: ",[57,9511,2222],{"href":200},[105,9513,9515],{"id":9514},"quick-validation-in-the-browser-console","Quick Validation in the Browser Console",[17,9517,9520],{"className":9518,"code":9519,"language":94,"meta":23},[92],"const text = `your JSON string`;\nJSON.parse(text);\n",[25,9521,9519],{"__ignoreMap":23},[28,9523,9524],{},"If there's a syntax error, an exception will be thrown, and the console will show the error message and approximate location.",[105,9526,9528],{"id":9527},"safe-parsing-in-code","Safe Parsing in Code",[28,9530,9531],{},"In Node.js \u002F frontend:",[17,9533,9536],{"className":9534,"code":9535,"language":94,"meta":23},[92],"try {\n  const data = JSON.parse(text);\n  \u002F\u002F Valid JSON, continue processing\n} catch (e) {\n  \u002F\u002F Invalid JSON\n  console.error('JSON parse failed:', e.message);\n}\n",[25,9537,9535],{"__ignoreMap":23},[28,9539,9540],{},"In production, it's recommended to:",[135,9542,9543,9549,9552],{},[138,9544,9545,9546,9548],{},"Avoid directly calling ",[25,9547,634],{}," on user input or untrusted sources.",[138,9550,9551],{},"Apply length limits and character whitelists before parsing.",[138,9553,9554],{},"Validate the resulting data structure against a schema (e.g., JSON Schema, Zod, Joi).",[71,9556,9558],{"id":9557},"differences-between-json-and-javascript-object-literals","Differences Between JSON and JavaScript Object Literals",[28,9560,9561],{},"Many people confuse JSON with JavaScript object literals, but they are not the same:",[135,9563,9564,9584,9602,9619],{},[138,9565,9566,9569],{},[32,9567,9568],{},"Key quotes",[135,9570,9571,9578],{},[138,9572,9573,9574,9577],{},"JS: ",[25,9575,9576],{},"{ name: \"Alice\" }"," is valid",[138,9579,9580,9581],{},"JSON: Must be written as ",[25,9582,9583],{},"{ \"name\": \"Alice\" }",[138,9585,9586,9589],{},[32,9587,9588],{},"Value types",[135,9590,9591,9597],{},[138,9592,9593,9594,9596],{},"JS: Can include functions, dates, regular expressions, ",[25,9595,313],{},", etc.",[138,9598,9599,9600],{},"JSON: Only objects, arrays, strings, numbers, booleans, and ",[25,9601,337],{},[138,9603,9604,9607],{},[32,9605,9606],{},"Comments",[135,9608,9609,9616],{},[138,9610,9611,9612,953,9614],{},"JS: Supports ",[25,9613,2060],{},[25,9615,2063],{},[138,9617,9618],{},"JSON: Does not support any comments",[138,9620,9621,9624],{},[32,9622,9623],{},"Quote style",[135,9625,9626,9629],{},[138,9627,9628],{},"JS: Strings can use single or double quotes",[138,9630,9631],{},"JSON: Only double quotes are allowed",[28,9633,9634,9635,69],{},"Therefore, you cannot simply treat a JS object as JSON and send it to the backend; you need to serialize it using ",[25,9636,9637],{},"JSON.stringify()",[71,9639,9641],{"id":9640},"practical-tips-how-to-use-json-effectively-in-your-projects","Practical Tips: How to Use JSON Effectively in Your Projects?",[530,9643,9644,9667,9685],{},[138,9645,9646,9649],{},[32,9647,9648],{},"API Design Phase",[135,9650,9651,9661,9664],{},[138,9652,9653,9654,9656,9657,9656,9659,5650],{},"Standardize response structures (e.g., ",[25,9655,6651],{}," + ",[25,9658,6658],{},[25,9660,6661],{},[138,9662,9663],{},"Specify that dates and times use ISO 8601 strings.",[138,9665,9666],{},"Avoid returning sensitive information in JSON (keys, internal IDs, debug info).",[138,9668,9669,9672],{},[32,9670,9671],{},"Frontend Handling",[135,9673,9674,9679,9682],{},[138,9675,7701,9676,9678],{},[25,9677,7430],{}," and status codes before parsing.",[138,9680,9681],{},"Paginate or lazy-load large JSON to avoid parsing huge payloads at once.",[138,9683,9684],{},"Use TypeScript or JSON Schema to enforce type constraints on API data structures.",[138,9686,9687,9690],{},[32,9688,9689],{},"Debugging and Troubleshooting",[135,9691,9692,9698],{},[138,9693,9694,9695,9697],{},"When encountering a ",[25,9696,5674],{},", first format the JSON with a tool, then locate the error line based on the hint.",[138,9699,9700],{},"Be cautious with \"strings that look like JSON\", especially those copied from logs or third-party documentation.",[48,9702,9703],{},[28,9704,9705,9706,9708],{},"If you frequently need to check and format JSON, bookmark our ",[57,9707,714],{"href":200}," to quickly validate any JSON snippet.",[71,9710,7485],{"id":7484},[135,9712,9713,9716,9719,9722],{},[138,9714,9715],{},"JSON is one of the most fundamental and important data formats in modern web development; understanding its strict syntax can significantly reduce API debugging time.",[138,9717,9718],{},"Common mistakes often come from \"writing like JavaScript objects\" instead of \"following the JSON spec strictly\": single quotes, trailing commas, comments, invalid values, etc.",[138,9720,9721],{},"In real projects, you need to consider API design, frontend parsing, and error handling together, not just the \"syntax level\".",[138,9723,9724],{},"Combining online JSON tools (formatting, validation, minification) can greatly improve development efficiency and also bring continuous search traffic and usage scenarios to your site.",{"title":23,"searchDepth":959,"depth":959,"links":9726},[9727,9728,9729,9734,9740,9749,9754,9755,9756],{"id":8903,"depth":959,"text":8904},{"id":8944,"depth":959,"text":8945},{"id":9014,"depth":959,"text":9015,"children":9730},[9731,9732,9733],{"id":9018,"depth":964,"text":9019},{"id":9052,"depth":964,"text":9053},{"id":9065,"depth":964,"text":9066},{"id":9084,"depth":959,"text":9085,"children":9735},[9736,9737,9738,9739],{"id":9088,"depth":964,"text":8955},{"id":9118,"depth":964,"text":8964},{"id":9139,"depth":964,"text":9140},{"id":9173,"depth":964,"text":9174},{"id":9183,"depth":959,"text":9184,"children":9741},[9742,9743,9744,9745,9747,9748],{"id":9190,"depth":964,"text":9191},{"id":9228,"depth":964,"text":9229},{"id":9277,"depth":964,"text":9278},{"id":9321,"depth":964,"text":9746},"Using Invalid Values: undefined, Functions, Date Objects, etc.",{"id":9359,"depth":964,"text":9360},{"id":9410,"depth":964,"text":9411},{"id":9482,"depth":959,"text":9483,"children":9750},[9751,9752,9753],{"id":9486,"depth":964,"text":9487},{"id":9514,"depth":964,"text":9515},{"id":9527,"depth":964,"text":9528},{"id":9557,"depth":959,"text":9558},{"id":9640,"depth":959,"text":9641},{"id":7484,"depth":959,"text":7485},"2026-08-23T00:00:00.000Z","A developer-focused guide to what JSON is, its data types and syntax rules, plus real-world API debugging examples and common JSON error fixes.","\u002Fblog\u002Fcover\u002Fen\u002Fwhat-is-json-cover.svg",[998,7553],{},"\u002Fen\u002Fblog\u002Fwhat-is-json",{"slug":2220,"text":9764,"btn":2222},"🚀 Skip straight to formatting\u002Fvalidating your JSON:",{"title":8883,"description":9758},"en\u002Fblog\u002Fwhat-is-json",[1009,714,8877,8878,9768],"Web Development","VfC-Ya_C_EBjdy1ftjp5NquHkAIO2AB0Eka1mtelg9w",1791273858398]