[{"data":1,"prerenderedAt":6345},["ShallowReactive",2],{"blog-batch-en-what-is-json-json-parse-error-debug-json-best-practices":3},[4,1044,2383,3281,4226,5496],{"id":5,"title":6,"author":7,"body":8,"category":1020,"date":1021,"description":1022,"draft":1023,"extension":1024,"h1":1025,"image":1026,"lastmod":1021,"locales":1027,"meta":1030,"navigation":856,"path":1031,"promo":1032,"seo":1036,"stem":1037,"tags":1038,"__hash__":1043},"blog\u002Fen\u002Fblog\u002Fjson-best-practices.md","JSON Best Practices in Real Projects: API Design, Performance, and Security","BulkPicTools Team",{"type":9,"value":10,"toc":977},"minimark",[11,15,28,36,48,51,56,61,64,69,80,85,91,94,123,127,133,139,142,148,151,155,161,188,191,203,205,209,213,216,236,239,253,260,264,267,273,275,283,285,301,305,307,361,363,371,373,377,381,384,390,392,400,403,415,419,422,430,433,445,448,456,460,463,469,471,479,481,485,489,492,511,514,520,522,532,536,539,557,560,568,571,575,578,615,617,622,624,628,632,635,643,645,653,657,660,666,669,671,675,679,686,694,696,701,705,708,714,716,724,726,730,734,737,743,746,754,756,770,774,776,781,783,791,793,801,805,807,815,817,825,827,835,837,841,845,883,887,924,928,949,951,955,969],[12,13,14],"p",{},"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:",[16,17,18,22,25],"ul",{},[19,20,21],"li",{},"Inconsistent response structures make frontend code hard to maintain;",[19,23,24],{},"Large JSON payloads cause page freezes and API timeouts;",[19,26,27],{},"Sensitive information accidentally ends up in responses, creating security risks.",[12,29,30,31,35],{},"This article covers ",[32,33,34],"strong",{},"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.",[37,38,39],"blockquote",{},[12,40,41,42,47],{},"If you're designing or refactoring APIs, you can paste example JSON into the ",[43,44,46],"a",{"href":45},"\u002F","JSON Editor"," on the homepage to adjust the structure while instantly checking format and validity.",[49,50],"hr",{},[52,53,55],"h2",{"id":54},"_1-standardizing-api-response-structures","1. Standardizing API Response Structures",[57,58,60],"h3",{"id":59},"_11-recommended-base-structure","1.1 Recommended Base Structure",[12,62,63],{},"For most business endpoints, use a consistent top-level structure, for example:",[12,65,66],{},[32,67,68],{},"Success response:",[70,71,77],"pre",{"className":72,"code":74,"language":75,"meta":76},[73],"language-json","{\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","json","",[78,79,74],"code",{"__ignoreMap":76},[12,81,82],{},[32,83,84],{},"Error response:",[70,86,89],{"className":87,"code":88,"language":75,"meta":76},[73],"{\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",[78,90,88],{"__ignoreMap":76},[12,92,93],{},"Benefits:",[16,95,96,103,117],{},[19,97,98,99,102],{},"The frontend only needs to check the ",[78,100,101],{},"success"," field to distinguish success vs. error.",[19,104,105,106,109,110,113,114,116],{},"Separating ",[78,107,108],{},"data"," and ",[78,111,112],{},"error"," avoids accessing non-existent ",[78,115,108],{}," on errors.",[19,118,119,122],{},[78,120,121],{},"meta"," can hold trace IDs, versions, etc., for logging and monitoring.",[57,124,126],{"id":125},"_12-list-endpoints-and-pagination-structure","1.2 List Endpoints and Pagination Structure",[12,128,129,130,132],{},"For list endpoints, use an array in ",[78,131,108],{}," with a consistent pagination structure:",[70,134,137],{"className":135,"code":136,"language":75,"meta":76},[73],"{\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",[78,138,136],{"__ignoreMap":76},[12,140,141],{},"Or cursor-based pagination (better for large datasets):",[70,143,146],{"className":144,"code":145,"language":75,"meta":76},[73],"{\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",[78,147,145],{"__ignoreMap":76},[12,149,150],{},"The frontend can then encapsulate unified list components and pagination logic.",[57,152,154],{"id":153},"_13-error-code-design-recommendations","1.3 Error Code Design Recommendations",[12,156,157,158,160],{},"In the ",[78,159,112],{}," object, include at least:",[16,162,163,176,182],{},[19,164,165,167,168,171,172,175],{},[78,166,78],{},": Machine-readable error code, e.g., ",[78,169,170],{},"USER_NOT_FOUND",", ",[78,173,174],{},"INVALID_JSON",".",[19,177,178,181],{},[78,179,180],{},"message",": Human-readable description, suitable for UI display.",[19,183,184,187],{},[78,185,186],{},"details"," (optional): Structured details for finer-grained handling or logging.",[12,189,190],{},"Avoid:",[16,192,193,200],{},[19,194,195,196,199],{},"Returning only a string: ",[78,197,198],{},"\"User not found\"",", making it hard for the frontend to distinguish error types.",[19,201,202],{},"Exposing full stack traces to the client (security risk).",[49,204],{},[52,206,208],{"id":207},"_2-field-naming-and-type-conventions","2. Field Naming and Type Conventions",[57,210,212],{"id":211},"_21-naming-style-camelcase-vs-snake_case","2.1 Naming Style: camelCase vs snake_case",[12,214,215],{},"Two common naming styles in JSON:",[16,217,218,227],{},[19,219,220,221,171,224],{},"camelCase: ",[78,222,223],{},"userId",[78,225,226],{},"createdAt",[19,228,229,230,171,233],{},"snake_case: ",[78,231,232],{},"user_id",[78,234,235],{},"created_at",[12,237,238],{},"Recommendations:",[16,240,241,247,250],{},[19,242,243,246],{},[32,244,245],{},"Standardize on one style"," within a project and team.",[19,248,249],{},"If your frontend is primarily JavaScript\u002FTypeScript, camelCase is usually more natural.",[19,251,252],{},"If your backend heavily uses frameworks that default to snake_case (e.g., Django), normalize at the serialization layer.",[12,254,255,256,259],{},"The key is: ",[32,257,258],{},"keep public APIs consistent",", avoid mixing styles within the same endpoint.",[57,261,263],{"id":262},"_22-dates-and-times-use-iso-8601-consistently","2.2 Dates and Times: Use ISO 8601 Consistently",[12,265,266],{},"Recommend using ISO 8601 strings for all date\u002Ftime fields:",[70,268,271],{"className":269,"code":270,"language":75,"meta":76},[73],"{\n  \"createdAt\": \"2026-08-25T08:00:00Z\",\n  \"updatedAt\": \"2026-08-25T08:30:00+08:00\"\n}\n",[78,272,270],{"__ignoreMap":76},[12,274,93],{},[16,276,277,280],{},[19,278,279],{},"Language-agnostic, with mature parsing libraries in almost every language.",[19,281,282],{},"Explicit timezone information avoids \"local time vs UTC\" ambiguity.",[12,284,190],{},[16,286,287,294],{},[19,288,289,290,293],{},"Using numeric timestamps (",[78,291,292],{},"1724572800",") without specifying units (seconds\u002Fmilliseconds).",[19,295,296,297,300],{},"Using custom formats (",[78,298,299],{},"\"2026\u002F08\u002F25 08:00\"","), increasing frontend parsing overhead.",[57,302,304],{"id":303},"_23-using-null-empty-objects-and-empty-arrays","2.3 Using null, Empty Objects, and Empty Arrays",[12,306,238],{},[16,308,309,322,331],{},[19,310,311,312,315,316],{},"For \"missing\" scalar fields, use ",[78,313,314],{},"null",":\n",[70,317,320],{"className":318,"code":319,"language":75,"meta":76},[73],"{\n  \"phone\": null\n}\n",[78,321,319],{"__ignoreMap":76},[19,323,324,325],{},"For \"empty lists\", use empty arrays:\n",[70,326,329],{"className":327,"code":328,"language":75,"meta":76},[73],"{\n  \"orders\": []\n}\n",[78,330,328],{"__ignoreMap":76},[19,332,333,334,356,357,360],{},"For \"missing objects\", two common strategies:\n",[16,335,336,347],{},[19,337,338,339,315,341],{},"Return ",[78,340,314],{},[70,342,345],{"className":343,"code":344,"language":75,"meta":76},[73],"{\n  \"profile\": null\n}\n",[78,346,344],{"__ignoreMap":76},[19,348,349,350],{},"Return an empty object:\n",[70,351,354],{"className":352,"code":353,"language":75,"meta":76},[73],"{\n  \"profile\": {}\n}\n",[78,355,353],{"__ignoreMap":76},"\nThe key is: ",[32,358,359],{},"standardize on one strategy"," within the project and document it.",[12,362,190],{},[16,364,365],{},[19,366,367,368,370],{},"Sometimes returning ",[78,369,314],{},", sometimes omitting the field entirely, forcing the frontend to handle multiple cases.",[49,372],{},[52,374,376],{"id":375},"_3-performance-related-practices","3. Performance-Related Practices",[57,378,380],{"id":379},"_31-return-only-necessary-fields","3.1 Return Only Necessary Fields",[12,382,383],{},"Return only the fields the frontend actually needs, instead of dumping entire tables:",[70,385,388],{"className":386,"code":387,"language":75,"meta":76},[73],"\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",[78,389,387],{"__ignoreMap":76},[12,391,93],{},[16,393,394,397],{},[19,395,396],{},"Reduces payload size and improves response time.",[19,398,399],{},"Lowers the risk of leaking sensitive information.",[12,401,402],{},"Implementation:",[16,404,405,408],{},[19,406,407],{},"Use DTO\u002FVO (Data Transfer Object \u002F View Object) layers on the backend to expose only necessary fields.",[19,409,410,411,414],{},"For complex objects, support a ",[78,412,413],{},"fields"," query parameter to let the frontend select fields (suitable for open APIs).",[57,416,418],{"id":417},"_32-large-lists-pagination-and-streaming","3.2 Large Lists: Pagination and Streaming",[12,420,421],{},"For potentially large lists:",[16,423,424,427],{},[19,425,426],{},"Always use pagination (page-based or cursor-based).",[19,428,429],{},"Avoid returning tens of thousands of records in one response.",[12,431,432],{},"Backend:",[16,434,435,442],{},[19,436,437,438,441],{},"Use database pagination (",[78,439,440],{},"LIMIT\u002FOFFSET"," or cursors).",[19,443,444],{},"For very large export endpoints, consider async jobs + file download instead of synchronous large JSON responses.",[12,446,447],{},"Frontend:",[16,449,450,453],{},[19,451,452],{},"Use virtual lists \u002F lazy loading to avoid rendering huge DOM trees at once.",[19,454,455],{},"For very large JSON, avoid heavy computation on the main thread; consider Web Workers.",[57,457,459],{"id":458},"_33-reduce-nesting-depth-and-redundancy","3.3 Reduce Nesting Depth and Redundancy",[12,461,462],{},"Excessive nesting and redundant fields increase parsing cost:",[70,464,467],{"className":465,"code":466,"language":75,"meta":76},[73],"\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",[78,468,466],{"__ignoreMap":76},[12,470,238],{},[16,472,473,476],{},[19,474,475],{},"Keep nesting depth around 3–5 levels.",[19,477,478],{},"Periodically review endpoint responses and remove unused fields.",[49,480],{},[52,482,484],{"id":483},"_4-security-related-practices","4. Security-Related Practices",[57,486,488],{"id":487},"_41-avoid-exposing-sensitive-information-in-json","4.1 Avoid Exposing Sensitive Information in JSON",[12,490,491],{},"Common but dangerous practices:",[16,493,494],{},[19,495,496,497],{},"Returning in responses:\n",[16,498,499,502,505,508],{},[19,500,501],{},"Passwords or password hashes",[19,503,504],{},"Internal keys, tokens",[19,506,507],{},"Full stack traces",[19,509,510],{},"Internal IDs, internal service URLs",[12,512,513],{},"Example (wrong):",[70,515,518],{"className":516,"code":517,"language":75,"meta":76},[73],"{\n  \"user\": {\n    \"id\": 1,\n    \"name\": \"Alice\",\n    \"passwordHash\": \"$2b$10$...\",\n    \"internalToken\": \"sk_live_...\"\n  }\n}\n",[78,519,517],{"__ignoreMap":76},[12,521,238],{},[16,523,524,527],{},[19,525,526],{},"Use dedicated \"public view\" objects that include only exposable fields.",[19,528,529,530,175],{},"For error responses, use generic messages; do not expose stack traces or internal details in ",[78,531,180],{},[57,533,535],{"id":534},"_42-validate-user-input-before-parsing","4.2 Validate User Input Before Parsing",[12,537,538],{},"For JSON data from users or third parties:",[16,540,541,544,547],{},[19,542,543],{},"Apply length limits (e.g., max 1MB).",[19,545,546],{},"Perform basic character validation (e.g., printable UTF-8 only).",[19,548,549,550,553,554,175],{},"Wrap ",[78,551,552],{},"JSON.parse"," in ",[78,555,556],{},"try...catch",[12,558,559],{},"Node.js example:",[70,561,566],{"className":562,"code":564,"language":565,"meta":76},[563],"language-js","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","js",[78,567,564],{"__ignoreMap":76},[12,569,570],{},"For critical business data, further validate structure using JSON Schema \u002F Zod \u002F Joi.",[57,572,574],{"id":573},"_43-sanitize-sensitive-fields-in-logs","4.3 Sanitize Sensitive Fields in Logs",[12,576,577],{},"When logging request\u002Fresponse JSON on the server:",[16,579,580],{},[19,581,582,583],{},"Sanitize sensitive fields:\n",[16,584,585,594,602],{},[19,586,587,590,591],{},[78,588,589],{},"email",": ",[78,592,593],{},"ali***@example.com",[19,595,596,590,599],{},[78,597,598],{},"phone",[78,600,601],{},"138****1234",[19,603,604,607,608,611,612,175],{},[78,605,606],{},"token"," \u002F ",[78,609,610],{},"password",": either omit or log as ",[78,613,614],{},"***",[12,616,190],{},[16,618,619],{},[19,620,621],{},"Writing complete requests\u002Fresponses to logs as-is, especially when they contain authentication or payment information.",[49,623],{},[52,625,627],{"id":626},"_5-integrating-with-typescript-json-schema","5. Integrating with TypeScript \u002F JSON Schema",[57,629,631],{"id":630},"_51-define-api-types-with-typescript","5.1 Define API Types with TypeScript",[12,633,634],{},"In TypeScript projects, define explicit types for each endpoint:",[70,636,641],{"className":637,"code":639,"language":640,"meta":76},[638],"language-ts","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","ts",[78,642,639],{"__ignoreMap":76},[12,644,93],{},[16,646,647,650],{},[19,648,649],{},"The compiler catches field name errors and type mismatches early.",[19,651,652],{},"Autocomplete improves developer productivity.",[57,654,656],{"id":655},"_52-use-json-schema-for-runtime-validation","5.2 Use JSON Schema for Runtime Validation",[12,658,659],{},"For third-party data or critical endpoints, define structure with JSON Schema and validate at runtime:",[70,661,664],{"className":662,"code":663,"language":75,"meta":76},[73],"{\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",[78,665,663],{"__ignoreMap":76},[12,667,668],{},"With a validation library, you can intercept non-conforming responses at runtime and surface issues early.",[49,670],{},[52,672,674],{"id":673},"_6-json-in-configuration-and-logs","6. JSON in Configuration and Logs",[57,676,678],{"id":677},"_61-configuration-files-strict-json-or-jsonc","6.1 Configuration Files: Strict JSON or JSONC",[12,680,681,682,685],{},"For configuration files (e.g., ",[78,683,684],{},"config.json","):",[16,687,688,691],{},[19,689,690],{},"Prefer strict JSON, avoiding comments and trailing commas.",[19,692,693],{},"If comments are truly needed, use JSONC (JSON with comments), but ensure your parser supports it.",[12,695,190],{},[16,697,698],{},[19,699,700],{},"Mixing single quotes, comments, and trailing commas in configs, leading to inconsistent parsing across environments.",[57,702,704],{"id":703},"_62-field-conventions-for-structured-logs","6.2 Field Conventions for Structured Logs",[12,706,707],{},"For structured JSON logs, standardize field conventions, e.g.:",[70,709,712],{"className":710,"code":711,"language":75,"meta":76},[73],"{\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",[78,713,711],{"__ignoreMap":76},[12,715,93],{},[16,717,718,721],{},[19,719,720],{},"Easier to query and aggregate in ELK \u002F Cloudflare Logs and similar systems.",[19,722,723],{},"Unified fields simplify alerts and dashboards.",[49,725],{},[52,727,729],{"id":728},"_7-common-anti-patterns","7. Common Anti-Patterns",[57,731,733],{"id":732},"_71-embedding-html-rich-text-in-json-without-clarification","7.1 Embedding HTML \u002F Rich Text in JSON Without Clarification",[12,735,736],{},"For example:",[70,738,741],{"className":739,"code":740,"language":75,"meta":76},[73],"{\n  \"content\": \"\u003Cp>Hello \u003Cstrong>world\u003C\u002Fstrong>\u003C\u002Fp>\"\n}\n",[78,742,740],{"__ignoreMap":76},[12,744,745],{},"Issues:",[16,747,748,751],{},[19,749,750],{},"If the frontend doesn't know this is HTML, it may render it as plain text.",[19,752,753],{},"XSS risk if inserted into the DOM without proper escaping\u002Ffiltering.",[12,755,238],{},[16,757,758,767],{},[19,759,760,761,171,764,175],{},"Use explicit field names like ",[78,762,763],{},"contentHtml",[78,765,766],{},"contentMarkdown",[19,768,769],{},"Frontend should decide whether to render as HTML based on the field name and apply proper escaping\u002Ffiltering.",[57,771,773],{"id":772},"_72-using-json-to-transfer-large-binaries","7.2 Using JSON to Transfer Large Binaries",[12,775,736],{},[16,777,778],{},[19,779,780],{},"Base64-encoding images or files and putting them in JSON fields.",[12,782,745],{},[16,784,785,788],{},[19,786,787],{},"Size bloat (base64 increases size by ~33%).",[19,789,790],{},"High parsing and transmission cost.",[12,792,238],{},[16,794,795,798],{},[19,796,797],{},"Use dedicated file upload endpoints and return file URLs or IDs.",[19,799,800],{},"Keep only metadata (URL, size, type) in JSON.",[57,802,804],{"id":803},"_73-returning-half-json-half-text-mixed-content","7.3 Returning \"Half JSON, Half Text\" Mixed Content",[12,806,736],{},[70,808,813],{"className":809,"code":811,"language":812,"meta":76},[810],"language-text","{\"success\":true}\n\u003C!-- debug info -->\n","text",[78,814,811],{"__ignoreMap":76},[12,816,745],{},[16,818,819,822],{},[19,820,821],{},"Cannot be parsed with standard JSON parsers.",[19,823,824],{},"May \"look fine\" during debugging but fail in production.",[12,826,238],{},[16,828,829,832],{},[19,830,831],{},"Use either pure JSON or pure HTML\u002Ftext, not mixed.",[19,833,834],{},"Output debug info via dedicated headers or logging systems, not appended to the response body.",[49,836],{},[52,838,840],{"id":839},"_8-checklist","8. Checklist",[57,842,844],{"id":843},"during-api-design","During API Design",[16,846,849,859,865,871,877],{"className":847},[848],"contains-task-list",[19,850,853,858],{"className":851},[852],"task-list-item",[854,855],"input",{"disabled":856,"type":857},true,"checkbox"," Are success\u002Ferror response structures standardized?",[19,860,862,864],{"className":861},[852],[854,863],{"disabled":856,"type":857}," Is there a unified error code convention?",[19,866,868,870],{"className":867},[852],[854,869],{"disabled":856,"type":857}," Are dates\u002Ftimes consistently using ISO 8601?",[19,872,874,876],{"className":873},[852],[854,875],{"disabled":856,"type":857}," Is field naming style (camelCase \u002F snake_case) consistent?",[19,878,880,882],{"className":879},[852],[854,881],{"disabled":856,"type":857}," Are sensitive fields avoided in responses?",[57,884,886],{"id":885},"during-frontend-parsing","During Frontend Parsing",[16,888,890,900,912,918],{"className":889},[848],[19,891,893,895,896,899],{"className":892},[852],[854,894],{"disabled":856,"type":857}," Do you check status code and ",[78,897,898],{},"Content-Type"," before parsing?",[19,901,903,905,906,908,909,911],{"className":902},[852],[854,904],{"disabled":856,"type":857}," Are all ",[78,907,552],{}," calls wrapped in ",[78,910,556],{},"?",[19,913,915,917],{"className":914},[852],[854,916],{"disabled":856,"type":857}," Is pagination\u002Flazy loading used for large JSON?",[19,919,921,923],{"className":920},[852],[854,922],{"disabled":856,"type":857}," Are third-party\u002Fuser inputs validated for length and structure?",[57,925,927],{"id":926},"logging-and-security","Logging and Security",[16,929,931,937,943],{"className":930},[848],[19,932,934,936],{"className":933},[852],[854,935],{"disabled":856,"type":857}," Are sensitive fields sanitized in logs?",[19,938,940,942],{"className":939},[852],[854,941],{"disabled":856,"type":857}," Are stack traces avoided in error responses?",[19,944,946,948],{"className":945},[852],[854,947],{"disabled":856,"type":857}," Are config files using strict JSON or controlled JSONC?",[49,950],{},[52,952,954],{"id":953},"summary","Summary",[16,956,957,960,963,966],{},[19,958,959],{},"In frontend–backend projects, \"using JSON well\" is not just about correct syntax; it's about API design, performance, and security.",[19,961,962],{},"Standardizing response structures, field conventions, and error codes significantly reduces frontend–backend collaboration costs.",[19,964,965],{},"Through field minimization, pagination, and streaming, you can effectively optimize performance issues caused by large JSON.",[19,967,968],{},"On the security side, avoiding sensitive data exposure, validating input, and sanitizing logs are basic but often overlooked practices.",[37,970,971],{},[12,972,973,974,976],{},"When designing and debugging APIs, you can paste example JSON into the ",[43,975,46],{"href":45}," to adjust structures while instantly checking format and validity, helping your team reach consensus faster.",{"title":76,"searchDepth":978,"depth":978,"links":979},2,[980,986,991,996,1001,1005,1009,1014,1019],{"id":54,"depth":978,"text":55,"children":981},[982,984,985],{"id":59,"depth":983,"text":60},3,{"id":125,"depth":983,"text":126},{"id":153,"depth":983,"text":154},{"id":207,"depth":978,"text":208,"children":987},[988,989,990],{"id":211,"depth":983,"text":212},{"id":262,"depth":983,"text":263},{"id":303,"depth":983,"text":304},{"id":375,"depth":978,"text":376,"children":992},[993,994,995],{"id":379,"depth":983,"text":380},{"id":417,"depth":983,"text":418},{"id":458,"depth":983,"text":459},{"id":483,"depth":978,"text":484,"children":997},[998,999,1000],{"id":487,"depth":983,"text":488},{"id":534,"depth":983,"text":535},{"id":573,"depth":983,"text":574},{"id":626,"depth":978,"text":627,"children":1002},[1003,1004],{"id":630,"depth":983,"text":631},{"id":655,"depth":983,"text":656},{"id":673,"depth":978,"text":674,"children":1006},[1007,1008],{"id":677,"depth":983,"text":678},{"id":703,"depth":983,"text":704},{"id":728,"depth":978,"text":729,"children":1010},[1011,1012,1013],{"id":732,"depth":983,"text":733},{"id":772,"depth":983,"text":773},{"id":803,"depth":983,"text":804},{"id":839,"depth":978,"text":840,"children":1015},[1016,1017,1018],{"id":843,"depth":983,"text":844},{"id":885,"depth":983,"text":886},{"id":926,"depth":983,"text":927},{"id":953,"depth":978,"text":954},"json_tools","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.",false,"md",null,"\u002Fblog\u002Fcover\u002Fen\u002Fjson-best-practices-cover.svg",[1028,1029],"en","zh-CN",{},"\u002Fen\u002Fblog\u002Fjson-best-practices",{"slug":1033,"text":1034,"btn":1035},"json-editor","🚀 Need to batch format or check JSON?","Open JSON Editor",{"title":6,"description":1022},"en\u002Fblog\u002Fjson-best-practices",[1039,46,1040,1041,1042],"JSON","API Design","Performance","Security","4bj8Q4T0OzJdG1mYSeLcjgIfpw6Fy7H3lLBPm_Z4iZA",{"id":1045,"title":1046,"author":1047,"body":1048,"category":1020,"date":2367,"description":2368,"draft":1023,"extension":1024,"h1":1025,"image":2369,"lastmod":2370,"locales":2371,"meta":2372,"navigation":856,"path":2373,"promo":2374,"seo":2376,"stem":2377,"tags":2378,"__hash__":2382},"blog\u002Fen\u002Fblog\u002Fjson-parse-error-debug.md","JSON Parse Failed: 10 Common API Errors and How to Debug Them","JSON Toolbox Team",{"type":9,"value":1049,"toc":2298},[1050,1064,1073,1077,1080,1107,1114,1117,1119,1123,1127,1142,1148,1152,1167,1171,1216,1220,1248,1250,1256,1259,1276,1280,1297,1300,1316,1319,1341,1343,1347,1350,1375,1379,1414,1417,1430,1433,1441,1443,1447,1450,1473,1476,1488,1491,1529,1532,1552,1554,1558,1561,1564,1589,1592,1603,1606,1620,1623,1647,1649,1653,1656,1668,1671,1679,1682,1690,1693,1708,1710,1714,1717,1732,1735,1740,1743,1772,1775,1783,1785,1789,1792,1816,1819,1827,1830,1838,1841,1879,1881,1885,1888,1904,1907,1915,1918,1926,1929,1940,1942,1948,1951,1962,1965,1973,1976,2000,2003,2039,2047,2049,2053,2056,2134,2136,2140,2249,2251,2253,2264,2272,2276],[12,1051,1052,1053,1055,1056,1059,1060,1063],{},"In frontend and backend development, \"JSON parse failed\" is one of the most common errors: your code expects a JSON response, but ",[78,1054,552],{}," throws an exception and the console fills with red errors.",[1057,1058],"br",{},"\nThis article breaks down ",[32,1061,1062],{},"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.",[37,1065,1066],{},[12,1067,1068,1069,1072],{},"If you have a \"parse failed\" JSON sample on hand, paste it into the ",[43,1070,46],{"href":1071},"\u002Ftools\u002Fformat\u002Fjson-editor"," to automatically check syntax and highlight the exact error position.",[52,1074,1076],{"id":1075},"overview-of-typical-error-messages","Overview of Typical Error Messages",[12,1078,1079],{},"Across different environments and scenarios, you might see errors like:",[16,1081,1082,1087,1092,1097,1102],{},[19,1083,1084],{},[78,1085,1086],{},"SyntaxError: Unexpected token ':' in JSON at position 3",[19,1088,1089],{},[78,1090,1091],{},"SyntaxError: Unexpected token '\u003C' in JSON at position 0",[19,1093,1094],{},[78,1095,1096],{},"SyntaxError: Unexpected token 'u' in JSON at position 20",[19,1098,1099],{},[78,1100,1101],{},"SyntaxError: Unexpected token '\u002F' in JSON at position 2",[19,1103,1104],{},[78,1105,1106],{},"JSONParseError: Unexpected end of JSON input",[12,1108,1109,1110,1113],{},"These all mean: ",[32,1111,1112],{},"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.",[12,1115,1116],{},"Below, we break them down by scenario.",[49,1118],{},[52,1120,1122],{"id":1121},"scenario-1-backend-returns-an-html-error-page-500404","Scenario 1: Backend Returns an HTML Error Page (500\u002F404)",[57,1124,1126],{"id":1125},"symptoms","Symptoms",[16,1128,1129,1132,1135],{},[19,1130,1131],{},"Your frontend calls an API expecting JSON.",[19,1133,1134],{},"The actual status code is 500\u002F404\u002F503, and the body is an HTML error page.",[19,1136,1137,1138,1141],{},"The frontend still calls ",[78,1139,1140],{},"JSON.parse(responseText)"," and fails with:",[37,1143,1144],{},[12,1145,1146],{},[78,1147,1091],{},[57,1149,1151],{"id":1150},"cause","Cause",[12,1153,1154,1155,1158,1159,1162,1163,1166],{},"HTML usually starts with ",[78,1156,1157],{},"\u003C!DOCTYPE html>"," or ",[78,1160,1161],{},"\u003Chtml>",", so the first character is ",[78,1164,1165],{},"\u003C",", which is not valid JSON.",[57,1168,1170],{"id":1169},"debugging-steps","Debugging Steps",[1172,1173,1174,1177,1184,1209],"ol",{},[19,1175,1176],{},"Open the browser's Network panel and find the request.",[19,1178,1179,1180,1183],{},"Check the ",[32,1181,1182],{},"Status"," code: is it 2xx?",[19,1185,1186,1187,553,1189,315,1192],{},"Check ",[78,1188,898],{},[32,1190,1191],{},"Response Headers",[16,1193,1194,1200],{},[19,1195,1196,1197,911],{},"Is it ",[78,1198,1199],{},"application\u002Fjson",[19,1201,1202,1203,607,1206,911],{},"Or ",[78,1204,1205],{},"text\u002Fhtml",[78,1207,1208],{},"text\u002Fplain",[19,1210,1211,1212,1215],{},"Inspect the ",[32,1213,1214],{},"Response Body",": is it an HTML error page?",[57,1217,1219],{"id":1218},"solutions","Solutions",[16,1221,1222,1241],{},[19,1223,1224,1225,1227,1228],{},"Before calling ",[78,1226,552],{}," on the frontend:\n",[16,1229,1230,1233],{},[19,1231,1232],{},"Check that the status code is 2xx;",[19,1234,1235,1236,1238,1239,175],{},"Check that ",[78,1237,898],{}," includes ",[78,1240,1199],{},[19,1242,1243,1244,1247],{},"For non-2xx responses, prioritize showing error information (e.g., ",[78,1245,1246],{},"error.message",") instead of trying to parse JSON.",[49,1249],{},[52,1251,1253,1254],{"id":1252},"scenario-2-content-type-is-not-applicationjson","Scenario 2: Content-Type Is Not ",[78,1255,1199],{},[57,1257,1126],{"id":1258},"symptoms-1",[16,1260,1261,1271],{},[19,1262,1263,1264,1266,1267,1158,1269,175],{},"The response body \"looks like JSON\", but ",[78,1265,898],{}," is ",[78,1268,1205],{},[78,1270,1208],{},[19,1272,1273,1274,175],{},"Some frameworks\u002Fmiddleware refuse to auto-parse, or your code hesitates to safely call ",[78,1275,552],{},[57,1277,1279],{"id":1278},"causes","Causes",[16,1281,1282,1288,1291],{},[19,1283,1284,1285,1287],{},"Backend framework configuration (e.g., defaulting to ",[78,1286,1205],{},").",[19,1289,1290],{},"Reverse proxy\u002Fgateway modifying response headers.",[19,1292,1293,1294,1296],{},"Error-handling middleware returning ",[78,1295,1205],{}," for all errors.",[57,1298,1170],{"id":1299},"debugging-steps-1",[1172,1301,1302,1307,1310],{},[19,1303,1186,1304,1306],{},[78,1305,898],{}," in the Network panel.",[19,1308,1309],{},"Compare response headers between working and failing endpoints.",[19,1311,1312,1313,1315],{},"Inspect backend code\u002Fconfiguration for explicit ",[78,1314,898],{}," settings.",[57,1317,1219],{"id":1318},"solutions-1",[16,1320,1321,1332],{},[19,1322,1323,1324,1327,1328,1331],{},"On the backend, consistently return ",[78,1325,1326],{},"Content-Type: application\u002Fjson"," and encode the body as UTF-8. Many frameworks also emit ",[78,1329,1330],{},"application\u002Fjson; charset=utf-8","; the important part is that the response body is actually valid JSON and uses a consistent UTF-8 encoding.",[19,1333,1334,1335,1337,1338,1340],{},"On the frontend, be cautious when parsing responses whose ",[78,1336,898],{}," is not ",[78,1339,1199],{},", or at least log them first.",[49,1342],{},[52,1344,1346],{"id":1345},"scenario-3-trailing-commas-single-quotes-comments-fake-json","Scenario 3: Trailing Commas \u002F Single Quotes \u002F Comments (\"Fake JSON\")",[57,1348,1126],{"id":1349},"symptoms-2",[16,1351,1352,1355],{},[19,1353,1354],{},"You copy \"JSON-like\" content from logs, docs, or chat tools.",[19,1356,1357,1358],{},"Parsing it in code or tools fails with:\n",[16,1359,1360,1365,1370],{},[19,1361,1362],{},[78,1363,1364],{},"Unexpected token ','",[19,1366,1367],{},[78,1368,1369],{},"Unexpected token ':'",[19,1371,1372],{},[78,1373,1374],{},"Unexpected token '\u002F'",[57,1376,1378],{"id":1377},"common-error-patterns","Common Error Patterns",[1172,1380,1381,1392,1403],{},[19,1382,1383,1386],{},[32,1384,1385],{},"Trailing commas",[70,1387,1390],{"className":1388,"code":1389,"language":75,"meta":76},[73],"{\n  \"name\": \"Alice\",\n  \"age\": 30,\n}\n",[78,1391,1389],{"__ignoreMap":76},[19,1393,1394,1397],{},[32,1395,1396],{},"Single quotes",[70,1398,1401],{"className":1399,"code":1400,"language":75,"meta":76},[73],"{\n  'name': 'Alice'\n}\n",[78,1402,1400],{"__ignoreMap":76},[19,1404,1405,1408],{},[32,1406,1407],{},"Comments in JSON",[70,1409,1412],{"className":1410,"code":1411,"language":75,"meta":76},[73],"{\n  \u002F\u002F user info\n  \"name\": \"Alice\"\n}\n",[78,1413,1411],{"__ignoreMap":76},[57,1415,1170],{"id":1416},"debugging-steps-2",[1172,1418,1419,1424,1427],{},[19,1420,1421,1422,175],{},"Paste the raw response\u002Ftext into the ",[43,1423,46],{"href":1071},[19,1425,1426],{},"Let the tool auto-format and highlight error positions.",[19,1428,1429],{},"Fix according to the hints: remove trailing commas, switch to double quotes, delete comments.",[57,1431,1219],{"id":1432},"solutions-2",[16,1434,1435,1438],{},[19,1436,1437],{},"Always run \"JSON from docs\u002Flogs\" through a validator first.",[19,1439,1440],{},"If you need \"config with comments\" in backend logs, use JSONC or YAML and clearly label it as \"non-standard JSON\".",[49,1442],{},[52,1444,1446],{"id":1445},"scenario-4-backend-returns-double-serialized-json-strings","Scenario 4: Backend Returns \"Double-Serialized\" JSON Strings",[57,1448,1126],{"id":1449},"symptoms-3",[16,1451,1452,1461,1470],{},[19,1453,1454,1455],{},"The response body is a string that contains JSON as text, e.g.:\n",[70,1456,1459],{"className":1457,"code":1458,"language":75,"meta":76},[73],"\"{\\\"key\\\":\\\"value\\\"}\"\n",[78,1460,1458],{"__ignoreMap":76},[19,1462,1463,1464,1466,1467,1469],{},"The frontend calls ",[78,1465,552],{}," once and gets a string, not an object; only a second ",[78,1468,552],{}," yields the object.",[19,1471,1472],{},"If your code assumes \"one parse gives an object\", it breaks.",[57,1474,1279],{"id":1475},"causes-1",[16,1477,1478,1485],{},[19,1479,1480,1481,1484],{},"The backend calls ",[78,1482,1483],{},"JSON.stringify"," on data that is already a JSON string.",[19,1486,1487],{},"Or an extra layer of wrapping happens in logs\u002Fmessage queues.",[57,1489,1170],{"id":1490},"debugging-steps-3",[1172,1492,1493,1511],{},[19,1494,1495,1496],{},"Inspect the raw response in the Network panel:\n",[16,1497,1498,1504],{},[19,1499,1500,1501,911],{},"Does it start and end with ",[78,1502,1503],{},"\"",[19,1505,1506,1507,1510],{},"Does it contain many ",[78,1508,1509],{},"\\\""," inside?",[19,1512,1513,1514,1520],{},"In the console:\n",[70,1515,1518],{"className":1516,"code":1517,"language":565,"meta":76},[563],"const once = JSON.parse(text);\nconsole.log(typeof once, once);\n",[78,1519,1517],{"__ignoreMap":76},[16,1521,1522],{},[19,1523,1524,1525,1528],{},"If ",[78,1526,1527],{},"typeof once === 'string'",", it's double-serialized.",[57,1530,1219],{"id":1531},"solutions-3",[16,1533,1534,1539],{},[19,1535,1536,1537,1484],{},"On the backend, avoid calling ",[78,1538,1483],{},[19,1540,1541,1542,1544,1545,1551],{},"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 ",[78,1543,552],{}," twice on every response — fix the API contract whenever possible:\n",[70,1546,1549],{"className":1547,"code":1548,"language":640,"meta":76},[638],"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",[78,1550,1548],{"__ignoreMap":76},"\nUse this only when your API contract explicitly documents double encoding. Otherwise, treat it as a backend contract bug.",[49,1553],{},[52,1555,1557],{"id":1556},"scenario-5-large-json-causing-timeouts-memory-issues","Scenario 5: Large JSON Causing Timeouts \u002F Memory Issues",[12,1559,1560],{},"A large payload is often valid JSON. The failure is usually a performance, memory, or transport problem — not a JSON syntax error.",[57,1562,1126],{"id":1563},"symptoms-4",[16,1565,1566,1569],{},[19,1567,1568],{},"The API returns a very large JSON (several MB or more).",[19,1570,1571,1572,315,1574],{},"When the frontend calls ",[78,1573,552],{},[16,1575,1576,1579],{},[19,1577,1578],{},"The page freezes or even crashes;",[19,1580,1581,1582,607,1585,1588],{},"Or you get ",[78,1583,1584],{},"Out of memory",[78,1586,1587],{},"Invalid argument"," errors in some environments.",[57,1590,1279],{"id":1591},"causes-2",[16,1593,1594,1597],{},[19,1595,1596],{},"Parsing huge JSON in one go puts heavy pressure on the main thread and memory.",[19,1598,1599,1600,1602],{},"Some environments (old browsers, low-end devices) have limits on single ",[78,1601,552],{}," calls.",[57,1604,1170],{"id":1605},"debugging-steps-4",[1172,1607,1608,1617],{},[19,1609,1610,1611,607,1614,1287],{},"Check the response size in the Network panel (",[78,1612,1613],{},"Size",[78,1615,1616],{},"Transferred",[19,1618,1619],{},"Try opening the JSON file locally in an editor to see if it's similarly slow.",[57,1621,1219],{"id":1622},"solutions-4",[16,1624,1625,1636],{},[19,1626,1627,1628],{},"On the backend:\n",[16,1629,1630,1633],{},[19,1631,1632],{},"Use pagination or cursor-based pagination for large lists;",[19,1634,1635],{},"Return only necessary fields to reduce payload size.",[19,1637,1638,1639],{},"On the frontend:\n",[16,1640,1641,1644],{},[19,1642,1643],{},"Use lazy loading \u002F virtual lists for large datasets;",[19,1645,1646],{},"Where possible, use streaming parsing (e.g., JSON stream libraries in Node.js).",[49,1648],{},[52,1650,1652],{"id":1651},"scenario-6-encoding-issues-non-utf-8-bom","Scenario 6: Encoding Issues (Non-UTF-8, BOM)",[57,1654,1126],{"id":1655},"symptoms-5",[16,1657,1658,1661],{},[19,1659,1660],{},"The response fails to parse in some environments with vague errors.",[19,1662,1663,1664,1667],{},"Opening the text in an editor reveals a BOM (",[78,1665,1666],{},"EF BB BF",") or non-UTF-8 encoding.",[57,1669,1279],{"id":1670},"causes-3",[16,1672,1673,1676],{},[19,1674,1675],{},"Some backends\u002Fproxies output UTF-8 with BOM or other encodings.",[19,1677,1678],{},"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.",[57,1680,1170],{"id":1681},"debugging-steps-5",[1172,1683,1684,1687],{},[19,1685,1686],{},"Save the response as a file and open it in an editor that shows encoding (e.g., VS Code, Notepad++).",[19,1688,1689],{},"Check for a BOM or non-UTF-8 encoding.",[57,1691,1219],{"id":1692},"solutions-5",[16,1694,1695,1698,1701],{},[19,1696,1697],{},"Ensure the backend outputs JSON as UTF-8 without BOM.",[19,1699,1700],{},"Configure gateways\u002Fproxies not to add BOM or change encoding.",[19,1702,1703,1704,1707],{},"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 ",[78,1705,1706],{},"U+FEFF",", proxy\u002Ftranscoding corruption, unescaped control characters in JSON strings, or incorrect text decoding. Don't attribute all \"vague parse errors\" to BOM.",[49,1709],{},[52,1711,1713],{"id":1712},"scenario-7-truncated-json-network-interruption-timeout","Scenario 7: Truncated JSON (Network Interruption \u002F Timeout)",[57,1715,1126],{"id":1716},"symptoms-6",[16,1718,1719,1722],{},[19,1720,1721],{},"The response is cut off during transmission.",[19,1723,1724,1725],{},"Errors like:\n",[37,1726,1727],{},[12,1728,1729],{},[78,1730,1731],{},"SyntaxError: Unexpected end of JSON input",[57,1733,1279],{"id":1734},"causes-4",[16,1736,1737],{},[19,1738,1739],{},"Unstable network, timeouts, or proxy interruptions truncate the JSON.",[57,1741,1170],{"id":1742},"debugging-steps-6",[1172,1744,1745,1763],{},[19,1746,1747,1748],{},"Check the request status in the Network panel:\n",[16,1749,1750],{},[19,1751,1752,1753,171,1756,171,1759,1762],{},"Does it show ",[78,1754,1755],{},"(failed)",[78,1757,1758],{},"timeout",[78,1760,1761],{},"aborted",", etc.?",[19,1764,1765,1766,1158,1769,1287],{},"Inspect whether the response content is clearly truncated (e.g., last character is not ",[78,1767,1768],{},"}",[78,1770,1771],{},"]",[57,1773,1219],{"id":1774},"solutions-6",[16,1776,1777,1780],{},[19,1778,1779],{},"Add retry logic on the frontend, especially for mobile\u002Funstable networks.",[19,1781,1782],{},"Optimize timeout and retry settings on the backend\u002Fops side.",[49,1784],{},[52,1786,1788],{"id":1787},"scenario-8-extra-text-mixed-in-prefixsuffix-garbage","Scenario 8: Extra Text Mixed In (Prefix\u002FSuffix Garbage)",[57,1790,1126],{"id":1791},"symptoms-7",[16,1793,1794,1810],{},[19,1795,1796,1797,1803,1804],{},"The response has extra text before or after the JSON, e.g.:\n",[70,1798,1801],{"className":1799,"code":1800,"language":812,"meta":76},[810],"Data: {\"key\":\"value\"}\n",[78,1802,1800],{"__ignoreMap":76},"\nor\n",[70,1805,1808],{"className":1806,"code":1807,"language":812,"meta":76},[810],"{\"key\":\"value\"}---END---\n",[78,1809,1807],{"__ignoreMap":76},[19,1811,1812,1813,1815],{},"Calling ",[78,1814,552],{}," on the entire string fails.",[57,1817,1279],{"id":1818},"causes-5",[16,1820,1821,1824],{},[19,1822,1823],{},"Some legacy systems\u002Fdebug logic append extra text to responses.",[19,1825,1826],{},"Logs\u002Fproxies add prefixes\u002Fsuffixes.",[57,1828,1170],{"id":1829},"debugging-steps-7",[1172,1831,1832,1835],{},[19,1833,1834],{},"Inspect the full response text in the Network panel.",[19,1836,1837],{},"Confirm whether there are extra characters before\u002Fafter the JSON.",[57,1839,1219],{"id":1840},"solutions-7",[16,1842,1843,1846,1856],{},[19,1844,1845],{},"Fix at the source if possible: ensure responses are pure JSON.",[19,1847,1848,1851,1852,1855],{},[32,1849,1850],{},"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 ",[78,1853,1854],{},"[]",", braces inside string fields, multiple JSON fragments, greedy matching, and masking of protocol-layer bugs.",[19,1857,1858,1859],{},"Reliable alternatives:\n",[1172,1860,1861,1864,1867,1870,1876],{},[19,1862,1863],{},"Fix the API so the response body is always pure JSON.",[19,1865,1866],{},"Design separate endpoints for different content types.",[19,1868,1869],{},"If the protocol uses a known wrapper format (SSE, NDJSON, JSONP, specific log format), use the corresponding parser.",[19,1871,1872,1873,1875],{},"For ad-hoc debugging, copy the raw content into the ",[43,1874,46],{"href":1071}," and manually identify the JSON boundaries.",[19,1877,1878],{},"Log limited, sanitized response fragments in code — don't guess JSON boundaries.",[49,1880],{},[52,1882,1884],{"id":1883},"scenario-9-backend-returns-half-json-half-text-mixed-content","Scenario 9: Backend Returns \"Half JSON, Half Text\" Mixed Content",[57,1886,1126],{"id":1887},"symptoms-8",[16,1889,1890,1899],{},[19,1891,1892,1893],{},"The first part of the response is JSON, the rest is plain text or HTML, e.g.:\n",[70,1894,1897],{"className":1895,"code":1896,"language":812,"meta":76},[810],"{\"success\":true}\n\u003Cscript>...\u003C\u002Fscript>\n",[78,1898,1896],{"__ignoreMap":76},[19,1900,1901,1903],{},[78,1902,552],{}," fails when it encounters the non-JSON part.",[57,1905,1279],{"id":1906},"causes-6",[16,1908,1909,1912],{},[19,1910,1911],{},"Error-handling logic outputs HTML\u002Fscripts after writing JSON.",[19,1913,1914],{},"Some frameworks append debug info on exceptions.",[57,1916,1170],{"id":1917},"debugging-steps-8",[1172,1919,1920,1923],{},[19,1921,1922],{},"Inspect the full response text to see if there's content after the JSON.",[19,1924,1925],{},"Check backend logs for exception stacks being written to the response.",[57,1927,1219],{"id":1928},"solutions-8",[16,1930,1931,1934],{},[19,1932,1933],{},"Ensure each response is either pure JSON or pure HTML, not mixed.",[19,1935,1936,1937,1939],{},"For error responses, use a consistent JSON structure (e.g., ",[78,1938,112],{}," field) and avoid appending HTML.",[49,1941],{},[52,1943,1945,1946],{"id":1944},"scenario-10-unvalidated-user-input-or-third-party-data-passed-to-jsonparse","Scenario 10: Unvalidated User Input or Third-Party Data Passed to ",[78,1947,552],{},[57,1949,1126],{"id":1950},"symptoms-9",[16,1952,1953,1959],{},[19,1954,1955,1956,1958],{},"Frontend\u002Fbackend directly calls ",[78,1957,552],{}," on user input, third-party webhooks, or queue messages.",[19,1960,1961],{},"When the data is invalid, it throws exceptions and can break the entire request flow.",[57,1963,1279],{"id":1964},"causes-7",[16,1966,1967,1970],{},[19,1968,1969],{},"Missing pre-validation: length, character set, structure, etc.",[19,1971,1972],{},"Assuming \"the other party will always send valid JSON\".",[57,1974,1170],{"id":1975},"debugging-steps-9",[1172,1977,1978,1994],{},[19,1979,1980,1981,1983,1984],{},"Review all ",[78,1982,552],{}," call sites in your code:\n",[16,1985,1986,1989],{},[19,1987,1988],{},"Is the data source trusted?",[19,1990,1991,1992,911],{},"Is it wrapped in ",[78,1993,556],{},[19,1995,1996,1997,1999],{},"For failing samples, paste them into the ",[43,1998,46],{"href":1071}," to see specific errors.",[57,2001,1219],{"id":2002},"solutions-9",[16,2004,2005,2030],{},[19,2006,2007,2008],{},"For all external input:\n",[16,2009,2010,2013,2016,2019,2024,2027],{},[19,2011,2012],{},"Set a realistic byte-size limit before parsing untrusted input (e.g., max 1MB).",[19,2014,2015],{},"Decode input as UTF-8.",[19,2017,2018],{},"Reject malformed encoding where your platform exposes decoding errors.",[19,2020,2021,2022,175],{},"Parse inside ",[78,2023,556],{},[19,2025,2026],{},"Validate the parsed value against a schema or application rules.",[19,2028,2029],{},"Avoid logging full untrusted payloads, especially if they may contain secrets.",[19,2031,2032,2033,1158,2036,175],{},"JSON allows Unicode strings — don't restrict to \"printable ASCII\" only, as that would reject valid international data like ",[78,2034,2035],{},"\"São Paulo\"",[78,2037,2038],{},"\"日本語\"",[12,2040,2041,2042,2046],{},"Once text can be parsed successfully, syntax validation is only the first step. Use ",[43,2043,2045],{"href":2044},"\u002Fblog\u002Fjson-validation-syntax-vs-schema","JSON Schema validation to check required fields, data types, and allowed values"," before accepting the data in your application.",[49,2048],{},[52,2050,2052],{"id":2051},"troubleshooting-checklist-worth-bookmarking","Troubleshooting Checklist (Worth Bookmarking)",[12,2054,2055],{},"When you hit a \"JSON parse failed\" error, troubleshoot in this order:",[1172,2057,2058,2064,2072,2085,2091,2104,2110,2116],{},[19,2059,2060,2063],{},[32,2061,2062],{},"Check status code",": is it 2xx?",[19,2065,2066,2069,2070,911],{},[32,2067,2068],{},"Check Content-Type",": is it ",[78,2071,1199],{},[19,2073,2074,315,2077],{},[32,2075,2076],{},"Inspect response content",[16,2078,2079,2082],{},[19,2080,2081],{},"Is it pure JSON, or HTML\u002Ftext?",[19,2083,2084],{},"Are there extra characters before\u002Fafter?",[19,2086,2087,2090],{},[32,2088,2089],{},"Check size",": is it unusually large (several MB+)?",[19,2092,2093,315,2096],{},[32,2094,2095],{},"Validate with a tool",[16,2097,2098],{},[19,2099,2100,2101,2103],{},"Paste the response into the ",[43,2102,46],{"href":1071}," to automatically check syntax errors.",[19,2105,2106,2109],{},[32,2107,2108],{},"Check encoding",": is there a BOM or non-UTF-8 encoding?",[19,2111,2112,2115],{},[32,2113,2114],{},"Check logs",": does the backend log show exception stacks written to the response?",[19,2117,2118,315,2121],{},[32,2119,2120],{},"Check code",[16,2122,2123,2131],{},[19,2124,2125,2126,2128,2129,911],{},"Is ",[78,2127,552],{}," wrapped in ",[78,2130,556],{},[19,2132,2133],{},"Are you trying to parse non-2xx responses?",[49,2135],{},[52,2137,2139],{"id":2138},"how-to-prevent-json-parse-failures","How to Prevent JSON Parse Failures?",[1172,2141,2142,2164,2194,2217],{},[19,2143,2144,2147],{},[32,2145,2146],{},"Standardize API Contracts",[16,2148,2149,2155,2161],{},[19,2150,2151,2152],{},"Success response: ",[78,2153,2154],{},"{ \"success\": true, \"data\": {...} }",[19,2156,2157,2158],{},"Error response: ",[78,2159,2160],{},"{ \"success\": false, \"error\": { \"code\": \"...\", \"message\": \"...\" } }",[19,2162,2163],{},"All responses are pure JSON, with no extra text.",[19,2165,2166,2169],{},[32,2167,2168],{},"Unified Parsing Logic on the Frontend",[16,2170,2171,2191],{},[19,2172,2173,2174,2177,2178],{},"Encapsulate a ",[78,2175,2176],{},"fetchJson"," utility:\n",[16,2179,2180,2182,2186],{},[19,2181,2062],{},[19,2183,1186,2184],{},[78,2185,898],{},[19,2187,2188,2189],{},"Then call ",[78,2190,552],{},[19,2192,2193],{},"Route all API calls through this function to reduce repeated mistakes.",[19,2195,2196,2199],{},[32,2197,2198],{},"Logging and Monitoring",[16,2200,2201,2214],{},[19,2202,2203,2204],{},"For failed parses, log:\n",[16,2205,2206,2209,2211],{},[19,2207,2208],{},"Status code",[19,2210,898],{},[19,2212,2213],{},"First 1KB of the response (sanitized)",[19,2215,2216],{},"This makes it easier to tell whether it's a backend or network issue.",[19,2218,2219,2222],{},[32,2220,2221],{},"Use Tools Effectively",[16,2223,2224,2241],{},[19,2225,2226,2227],{},"During development:\n",[16,2228,2229,2235],{},[19,2230,2231,2232,2234],{},"Use the ",[43,2233,46],{"href":1071}," to quickly validate API responses.",[19,2236,2237,2240],{},[43,2238,2239],{"href":1071},"Format complex structures"," before reading them.",[19,2242,2243,2244],{},"For production issues:\n",[16,2245,2246],{},[19,2247,2248],{},"Paste problematic samples into the editor to quickly locate syntax errors.",[49,2250],{},[52,2252,954],{"id":953},[16,2254,2255,2258,2261],{},[19,2256,2257],{},"\"JSON parse failed\" can have many causes: HTML error pages, format errors, encoding issues, truncated responses, double serialization, and more.",[19,2259,2260],{},"A systematic troubleshooting flow (status code → Content-Type → response content → tool validation) can significantly reduce debugging time.",[19,2262,2263],{},"In the long run, standardizing API contracts, encapsulating parsing logic, and using validation tools are key to minimizing these issues.",[37,2265,2266],{},[12,2267,2268,2269,2271],{},"Next time you hit a JSON parse error, try pasting the response into the ",[43,2270,46],{"href":1071}," first to quickly confirm whether it's a syntax issue, then decide whether to fix it on the frontend or escalate to backend debugging.",[52,2273,2275],{"id":2274},"whats-next","What's Next?",[16,2277,2278,2284,2291],{},[19,2279,2280,2281,175],{},"Once the text can be parsed, syntax validation is only the first layer. Learn how to use ",[43,2282,2283],{"href":2044},"JSON Schema validation to check structure, required fields, and data types",[19,2285,2286,2287,175],{},"For a foundational overview of JSON structure and syntax rules, see ",[43,2288,2290],{"href":2289},"\u002Fblog\u002Fwhat-is-json","What Is JSON?",[19,2292,2293,2294,175],{},"For API design patterns and response structure best practices, see ",[43,2295,2297],{"href":2296},"\u002Fblog\u002Fjson-best-practices","JSON Best Practices",{"title":76,"searchDepth":978,"depth":978,"links":2299},[2300,2301,2307,2314,2320,2326,2332,2338,2344,2350,2356,2363,2364,2365,2366],{"id":1075,"depth":978,"text":1076},{"id":1121,"depth":978,"text":1122,"children":2302},[2303,2304,2305,2306],{"id":1125,"depth":983,"text":1126},{"id":1150,"depth":983,"text":1151},{"id":1169,"depth":983,"text":1170},{"id":1218,"depth":983,"text":1219},{"id":1252,"depth":978,"text":2308,"children":2309},"Scenario 2: Content-Type Is Not application\u002Fjson",[2310,2311,2312,2313],{"id":1258,"depth":983,"text":1126},{"id":1278,"depth":983,"text":1279},{"id":1299,"depth":983,"text":1170},{"id":1318,"depth":983,"text":1219},{"id":1345,"depth":978,"text":1346,"children":2315},[2316,2317,2318,2319],{"id":1349,"depth":983,"text":1126},{"id":1377,"depth":983,"text":1378},{"id":1416,"depth":983,"text":1170},{"id":1432,"depth":983,"text":1219},{"id":1445,"depth":978,"text":1446,"children":2321},[2322,2323,2324,2325],{"id":1449,"depth":983,"text":1126},{"id":1475,"depth":983,"text":1279},{"id":1490,"depth":983,"text":1170},{"id":1531,"depth":983,"text":1219},{"id":1556,"depth":978,"text":1557,"children":2327},[2328,2329,2330,2331],{"id":1563,"depth":983,"text":1126},{"id":1591,"depth":983,"text":1279},{"id":1605,"depth":983,"text":1170},{"id":1622,"depth":983,"text":1219},{"id":1651,"depth":978,"text":1652,"children":2333},[2334,2335,2336,2337],{"id":1655,"depth":983,"text":1126},{"id":1670,"depth":983,"text":1279},{"id":1681,"depth":983,"text":1170},{"id":1692,"depth":983,"text":1219},{"id":1712,"depth":978,"text":1713,"children":2339},[2340,2341,2342,2343],{"id":1716,"depth":983,"text":1126},{"id":1734,"depth":983,"text":1279},{"id":1742,"depth":983,"text":1170},{"id":1774,"depth":983,"text":1219},{"id":1787,"depth":978,"text":1788,"children":2345},[2346,2347,2348,2349],{"id":1791,"depth":983,"text":1126},{"id":1818,"depth":983,"text":1279},{"id":1829,"depth":983,"text":1170},{"id":1840,"depth":983,"text":1219},{"id":1883,"depth":978,"text":1884,"children":2351},[2352,2353,2354,2355],{"id":1887,"depth":983,"text":1126},{"id":1906,"depth":983,"text":1279},{"id":1917,"depth":983,"text":1170},{"id":1928,"depth":983,"text":1219},{"id":1944,"depth":978,"text":2357,"children":2358},"Scenario 10: Unvalidated User Input or Third-Party Data Passed to JSON.parse",[2359,2360,2361,2362],{"id":1950,"depth":983,"text":1126},{"id":1964,"depth":983,"text":1279},{"id":1975,"depth":983,"text":1170},{"id":2002,"depth":983,"text":1219},{"id":2051,"depth":978,"text":2052},{"id":2138,"depth":978,"text":2139},{"id":953,"depth":978,"text":954},{"id":2274,"depth":978,"text":2275},"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","2026-09-03T00:00:00.000Z",[1028,1029],{},"\u002Fen\u002Fblog\u002Fjson-parse-error-debug",{"slug":1033,"text":2375,"btn":1035},"🚀 Validate your JSON first:",{"title":1046,"description":2368},"en\u002Fblog\u002Fjson-parse-error-debug",[1039,46,2379,2380,2381,552],"JSON Validator","API Debugging","Error Handling","IRM6Gkn-n4JrWkRL1W1vrEVS6vc0ryQO55leFG2MLTc",{"id":2384,"title":2385,"author":1047,"body":2386,"category":1020,"date":3268,"description":3269,"draft":1023,"extension":1024,"h1":1025,"image":3270,"lastmod":3268,"locales":3271,"meta":3272,"navigation":856,"path":3273,"promo":3274,"seo":3276,"stem":3277,"tags":3278,"__hash__":3280},"blog\u002Fen\u002Fblog\u002Fwhat-is-json.md","What Is JSON? Structure, Syntax, and Common Mistakes (2026 Developer Guide)",{"type":9,"value":2387,"toc":3236},[2388,2405,2409,2412,2443,2446,2450,2453,2503,2520,2524,2528,2534,2537,2558,2562,2568,2571,2575,2581,2590,2594,2597,2618,2624,2627,2639,2645,2649,2673,2679,2683,2689,2693,2696,2700,2703,2709,2712,2719,2722,2728,2734,2738,2740,2745,2748,2754,2757,2764,2766,2772,2778,2783,2787,2789,2795,2797,2803,2805,2811,2814,2819,2827,2834,2836,2842,2844,2850,2852,2858,2865,2869,2871,2877,2879,2885,2887,2894,2896,2902,2908,2916,2920,2923,2933,2935,2941,2950,2953,2972,2975,2988,2992,2996,2999,3010,3013,3020,3024,3030,3033,3037,3040,3046,3049,3063,3067,3070,3142,3148,3152,3212,3220,3222],[12,2389,2390,2391,109,2394,2397,2398,2400,2401,2404],{},"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 ",[78,2392,2393],{},"package.json",[78,2395,2396],{},"tsconfig.json",", and even structured logs and message queues.",[1057,2399],{},"\nInstead of a textbook-style introduction, this guide focuses on ",[32,2402,2403],{},"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.",[52,2406,2408],{"id":2407},"why-developers-must-understand-json","Why Developers Must Understand JSON",[12,2410,2411],{},"In modern web development, JSON is everywhere:",[16,2413,2414,2420,2431,2437],{},[19,2415,2416,2419],{},[32,2417,2418],{},"Frontend–backend communication",": RESTful APIs and most GraphQL services use JSON for request\u002Fresponse bodies.",[19,2421,2422,590,2425,2427,2428,2430],{},[32,2423,2424],{},"Configuration files",[78,2426,2393],{}," in Node.js projects, ",[78,2429,2396],{}," in TypeScript, and many other config files are JSON or JSON supersets.",[19,2432,2433,2436],{},[32,2434,2435],{},"Logging and monitoring",": Many logging systems (e.g., ELK, Cloudflare Logs) store structured logs in JSON format.",[19,2438,2439,2442],{},[32,2440,2441],{},"Third-party integrations",": Payment, SMS, email, analytics SDKs typically return or accept JSON.",[12,2444,2445],{},"Not understanding JSON's strict syntax rules can waste a lot of time when debugging APIs, parsing responses, or handling configuration.",[52,2447,2449],{"id":2448},"json-data-types-more-than-just-objects-and-arrays","JSON Data Types: More Than Just \"Objects and Arrays\"",[12,2451,2452],{},"JSON supports only a limited set of data types, which is why it's simple and easy to parse:",[16,2454,2455,2464,2472,2480,2486,2497],{},[19,2456,2457,2460,2461,175],{},[32,2458,2459],{},"Object",": A collection of key–value pairs, wrapped in ",[78,2462,2463],{},"{}",[19,2465,2466,2469,2470,175],{},[32,2467,2468],{},"Array",": An ordered list, wrapped in ",[78,2471,1854],{},[19,2473,2474,2477,2478,175],{},[32,2475,2476],{},"String",": Must be wrapped in double quotes ",[78,2479,1503],{},[19,2481,2482,2485],{},[32,2483,2484],{},"Number",": Integer or floating-point; hexadecimal and octal are not allowed.",[19,2487,2488,590,2491,1158,2494,175],{},[32,2489,2490],{},"Boolean",[78,2492,2493],{},"true",[78,2495,2496],{},"false",[19,2498,2499,2502],{},[32,2500,2501],{},"Null",": Represents \"no value\".",[12,2504,2505,2506,2509,2510,2513,2514,2516,2517,175],{},"JSON does ",[32,2507,2508],{},"not"," support functions, Date objects, regular expressions, ",[78,2511,2512],{},"undefined",", comments, etc.",[1057,2515],{},"\nIn real projects, dates are usually represented as ISO 8601 strings, e.g. ",[78,2518,2519],{},"\"2026-08-23T08:00:00Z\"",[52,2521,2523],{"id":2522},"what-does-json-look-like-in-real-apis","What Does JSON Look Like in Real APIs?",[57,2525,2527],{"id":2526},"typical-rest-api-response","Typical REST API Response",[70,2529,2532],{"className":2530,"code":2531,"language":75,"meta":76},[73],"{\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",[78,2533,2531],{"__ignoreMap":76},[12,2535,2536],{},"Characteristics:",[16,2538,2539,2549,2552],{},[19,2540,2541,2542,171,2544,171,2546,2548],{},"The top level is an object, making it easy to extend (",[78,2543,101],{},[78,2545,108],{},[78,2547,121],{},", etc.).",[19,2550,2551],{},"Nested objects and arrays express complex structures.",[19,2553,2554,2555,175],{},"Dates are represented as strings, not ",[78,2556,2557],{},"new Date()",[57,2559,2561],{"id":2560},"list-endpoint-paginated","List Endpoint (Paginated)",[70,2563,2566],{"className":2564,"code":2565,"language":75,"meta":76},[73],"{\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",[78,2567,2565],{"__ignoreMap":76},[12,2569,2570],{},"This pattern is very common in admin dashboards and content listings.",[57,2572,2574],{"id":2573},"error-response-often-overlooked","Error Response (Often Overlooked)",[70,2576,2579],{"className":2577,"code":2578,"language":75,"meta":76},[73],"{\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",[78,2580,2578],{"__ignoreMap":76},[12,2582,2583,2584,2586,2587,2589],{},"When the backend fails to validate JSON, it often returns a structure like this. If the frontend blindly calls ",[78,2585,552],{}," on the raw response without checking the ",[78,2588,101],{}," field, it can easily mishandle errors.",[52,2591,2593],{"id":2592},"json-syntax-rules-from-it-runs-to-strictly-correct","JSON Syntax Rules: From \"It Runs\" to \"Strictly Correct\"",[57,2595,2459],{"id":2596},"object",[16,2598,2599,2604,2611],{},[19,2600,2601,2602,175],{},"Wrapped in ",[78,2603,2463],{},[19,2605,2606,2607,2610],{},"Contains zero or more ",[78,2608,2609],{},"\"key\": value"," pairs, separated by commas.",[19,2612,2613,2614,2617],{},"Keys ",[32,2615,2616],{},"must"," be double-quoted strings.",[70,2619,2622],{"className":2620,"code":2621,"language":75,"meta":76},[73],"{\n  \"id\": 123,\n  \"name\": \"JSON Guide\",\n  \"active\": true,\n  \"meta\": null\n}\n",[78,2623,2621],{"__ignoreMap":76},[57,2625,2468],{"id":2626},"array",[16,2628,2629,2633,2636],{},[19,2630,2601,2631,175],{},[78,2632,1854],{},[19,2634,2635],{},"Contains zero or more values, separated by commas.",[19,2637,2638],{},"Values can be any valid JSON value, and types can be mixed.",[70,2640,2643],{"className":2641,"code":2642,"language":75,"meta":76},[73],"[\n  \"apple\",\n  42,\n  true,\n  { \"key\": \"value\" },\n[1][2][3]\n]\n",[78,2644,2642],{"__ignoreMap":76},[57,2646,2648],{"id":2647},"strings-and-escaping","Strings and Escaping",[16,2650,2651,2656],{},[19,2652,2653,2654,175],{},"Must use double quotes ",[78,2655,1503],{},[19,2657,2658,2659,171,2661,171,2664,171,2667,171,2670,175],{},"Common escapes: ",[78,2660,1509],{},[78,2662,2663],{},"\\\\",[78,2665,2666],{},"\\n",[78,2668,2669],{},"\\t",[78,2671,2672],{},"\\uXXXX",[70,2674,2677],{"className":2675,"code":2676,"language":75,"meta":76},[73],"{\n  \"message\": \"He said \\\"hello\\\"\",\n  \"path\": \"C:\\\\Users\\\\Alice\",\n  \"multiline\": \"Line1\\nLine2\"\n}\n",[78,2678,2676],{"__ignoreMap":76},[57,2680,2682],{"id":2681},"numbers-booleans-and-null","Numbers, Booleans, and Null",[70,2684,2687],{"className":2685,"code":2686,"language":75,"meta":76},[73],"{\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",[78,2688,2686],{"__ignoreMap":76},[52,2690,2692],{"id":2691},"common-json-mistakes-from-error-messages-to-fixes","Common JSON Mistakes: From Error Messages to Fixes",[12,2694,2695],{},"Below are the most common JSON mistakes in real development, along with typical error messages and debugging strategies.",[57,2697,2699],{"id":2698},"using-single-quotes-or-unquoted-keys","Using Single Quotes or Unquoted Keys",[12,2701,2702],{},"Invalid:",[70,2704,2707],{"className":2705,"code":2706,"language":75,"meta":76},[73],"{\n  'name': 'Alice',\n  name: \"Alice\"\n}\n",[78,2708,2706],{"__ignoreMap":76},[12,2710,2711],{},"Typical error (browser \u002F Node.js):",[37,2713,2714],{},[12,2715,2716],{},[78,2717,2718],{},"SyntaxError: Unexpected token ':' in JSON at position 1",[12,2720,2721],{},"Fix:",[70,2723,2726],{"className":2724,"code":2725,"language":75,"meta":76},[73],"{\n  \"name\": \"Alice\"\n}\n",[78,2727,2725],{"__ignoreMap":76},[12,2729,2730,2733],{},[32,2731,2732],{},"Key point",": All strings in JSON, including keys, must be double-quoted.",[57,2735,2737],{"id":2736},"trailing-commas","Trailing Commas",[12,2739,2702],{},[70,2741,2743],{"className":2742,"code":1389,"language":75,"meta":76},[73],[78,2744,1389],{"__ignoreMap":76},[12,2746,2747],{},"or:",[70,2749,2752],{"className":2750,"code":2751,"language":75,"meta":76},[73],"[1, 2, 3,]\n",[78,2753,2751],{"__ignoreMap":76},[12,2755,2756],{},"Typical error:",[37,2758,2759],{},[12,2760,2761],{},[78,2762,2763],{},"SyntaxError: Unexpected token '}' in JSON at position 27",[12,2765,2721],{},[70,2767,2770],{"className":2768,"code":2769,"language":75,"meta":76},[73],"{\n  \"name\": \"Alice\",\n  \"age\": 30\n}\n",[78,2771,2769],{"__ignoreMap":76},[70,2773,2776],{"className":2774,"code":2775,"language":75,"meta":76},[73],"[1][2][3]\n",[78,2777,2775],{"__ignoreMap":76},[12,2779,2780,2782],{},[32,2781,2732],{},": JSON does not allow trailing commas after the last element.",[57,2784,2786],{"id":2785},"writing-comments-in-json","Writing Comments in JSON",[12,2788,2702],{},[70,2790,2793],{"className":2791,"code":2792,"language":75,"meta":76},[73],"{\n  \u002F\u002F User info\n  \"name\": \"Alice\",\n  \"age\": 30\n}\n",[78,2794,2792],{"__ignoreMap":76},[12,2796,2747],{},[70,2798,2801],{"className":2799,"code":2800,"language":75,"meta":76},[73],"{\n  \"name\": \"Alice\", \u002F* age *\u002F \"age\": 30\n}\n",[78,2802,2800],{"__ignoreMap":76},[12,2804,2756],{},[37,2806,2807],{},[12,2808,2809],{},[78,2810,1101],{},[12,2812,2813],{},"Fix: Remove all comments.",[70,2815,2817],{"className":2816,"code":2769,"language":75,"meta":76},[73],[78,2818,2769],{"__ignoreMap":76},[12,2820,2821,2823,2824,2826],{},[32,2822,2732],{},": Standard JSON does not support any form of comments.",[1057,2825],{},"\nIf you really need \"config with comments\", consider JSONC or YAML, but they are not standard JSON.",[57,2828,2830,2831,2833],{"id":2829},"using-invalid-values-undefined-functions-date-objects-etc","Using Invalid Values: ",[78,2832,2512],{},", Functions, Date Objects, etc.",[12,2835,2702],{},[70,2837,2840],{"className":2838,"code":2839,"language":75,"meta":76},[73],"{\n  \"name\": \"Alice\",\n  \"created\": undefined,\n  \"handler\": function() {},\n  \"date\": new Date()\n}\n",[78,2841,2839],{"__ignoreMap":76},[12,2843,2756],{},[37,2845,2846],{},[12,2847,2848],{},[78,2849,1096],{},[12,2851,2721],{},[70,2853,2856],{"className":2854,"code":2855,"language":75,"meta":76},[73],"{\n  \"name\": \"Alice\",\n  \"created\": null,\n  \"handler\": null,\n  \"date\": \"2026-08-23T08:00:00Z\"\n}\n",[78,2857,2855],{"__ignoreMap":76},[12,2859,2860,2862,2863,175],{},[32,2861,2732],{},": JSON only supports objects, arrays, strings, numbers, booleans, and ",[78,2864,314],{},[57,2866,2868],{"id":2867},"unescaped-quotes-or-newlines-in-strings","Unescaped Quotes or Newlines in Strings",[12,2870,2702],{},[70,2872,2875],{"className":2873,"code":2874,"language":75,"meta":76},[73],"{\n  \"message\": \"He said \"hello\"\"\n}\n",[78,2876,2874],{"__ignoreMap":76},[12,2878,2747],{},[70,2880,2883],{"className":2881,"code":2882,"language":75,"meta":76},[73],"{\n  \"text\": \"Line1\nLine2\"\n}\n",[78,2884,2882],{"__ignoreMap":76},[12,2886,2756],{},[37,2888,2889],{},[12,2890,2891],{},[78,2892,2893],{},"SyntaxError: Unexpected token 'h' in JSON at position 15",[12,2895,2721],{},[70,2897,2900],{"className":2898,"code":2899,"language":75,"meta":76},[73],"{\n  \"message\": \"He said \\\"hello\\\"\"\n}\n",[78,2901,2899],{"__ignoreMap":76},[70,2903,2906],{"className":2904,"code":2905,"language":75,"meta":76},[73],"{\n  \"text\": \"Line1\\nLine2\"\n}\n",[78,2907,2905],{"__ignoreMap":76},[12,2909,2910,2912,2913,2915],{},[32,2911,2732],{},": Double quotes inside strings must be escaped as ",[78,2914,1509],{},", and control characters like newlines must use escape sequences.",[57,2917,2919],{"id":2918},"parsing-an-html-error-page-as-json","Parsing an HTML Error Page as JSON",[12,2921,2922],{},"Real-world scenario:",[16,2924,2925,2928],{},[19,2926,2927],{},"The server returns 500\u002F404 with an HTML error page as the body, not JSON.",[19,2929,1137,2930,2932],{},[78,2931,1140],{}," and fails.",[12,2934,2756],{},[37,2936,2937],{},[12,2938,2939],{},[78,2940,1091],{},[12,2942,2943,2944,2946,2947,2949],{},"Reason: HTML starts with ",[78,2945,1165],{}," (e.g. ",[78,2948,1157],{},"), which is not valid JSON.",[12,2951,2952],{},"Debugging steps:",[1172,2954,2955,2962,2969],{},[19,2956,2957,2958,2961],{},"Open the browser's Network panel and inspect the ",[32,2959,2960],{},"Response"," of the request.",[19,2963,2964,2965,1266,2967,175],{},"Check whether the ",[78,2966,898],{},[78,2968,1199],{},[19,2970,2971],{},"Verify that the status code is 2xx and that the body is actual JSON.",[12,2973,2974],{},"Solutions:",[16,2976,2977,2983],{},[19,2978,2979,2980,2982],{},"Before parsing, check ",[78,2981,898],{}," and the status code.",[19,2984,2985,2986,175],{},"For non-2xx responses, prioritize reading error information instead of directly calling ",[78,2987,552],{},[52,2989,2991],{"id":2990},"how-to-quickly-check-if-json-is-valid","How to Quickly Check if JSON Is Valid?",[57,2993,2995],{"id":2994},"using-online-json-validation-and-formatting-tools","Using Online JSON Validation and Formatting Tools",[12,2997,2998],{},"Paste your JSON into an online tool to:",[16,3000,3001,3004,3007],{},[19,3002,3003],{},"Automatically check syntax errors and highlight the error location (line\u002Fcolumn).",[19,3005,3006],{},"One-click formatting (indentation, newlines) for easier reading and debugging.",[19,3008,3009],{},"Support minification to reduce payload size.",[12,3011,3012],{},"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.",[37,3014,3015],{},[12,3016,3017,3018],{},"🚀 Skip straight to formatting\u002Fvalidating your JSON: ",[43,3019,1035],{"href":45},[57,3021,3023],{"id":3022},"quick-validation-in-the-browser-console","Quick Validation in the Browser Console",[70,3025,3028],{"className":3026,"code":3027,"language":565,"meta":76},[563],"const text = `your JSON string`;\nJSON.parse(text);\n",[78,3029,3027],{"__ignoreMap":76},[12,3031,3032],{},"If there's a syntax error, an exception will be thrown, and the console will show the error message and approximate location.",[57,3034,3036],{"id":3035},"safe-parsing-in-code","Safe Parsing in Code",[12,3038,3039],{},"In Node.js \u002F frontend:",[70,3041,3044],{"className":3042,"code":3043,"language":565,"meta":76},[563],"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",[78,3045,3043],{"__ignoreMap":76},[12,3047,3048],{},"In production, it's recommended to:",[16,3050,3051,3057,3060],{},[19,3052,3053,3054,3056],{},"Avoid directly calling ",[78,3055,552],{}," on user input or untrusted sources.",[19,3058,3059],{},"Apply length limits and character whitelists before parsing.",[19,3061,3062],{},"Validate the resulting data structure against a schema (e.g., JSON Schema, Zod, Joi).",[52,3064,3066],{"id":3065},"differences-between-json-and-javascript-object-literals","Differences Between JSON and JavaScript Object Literals",[12,3068,3069],{},"Many people confuse JSON with JavaScript object literals, but they are not the same:",[16,3071,3072,3092,3110,3129],{},[19,3073,3074,3077],{},[32,3075,3076],{},"Key quotes",[16,3078,3079,3086],{},[19,3080,3081,3082,3085],{},"JS: ",[78,3083,3084],{},"{ name: \"Alice\" }"," is valid",[19,3087,3088,3089],{},"JSON: Must be written as ",[78,3090,3091],{},"{ \"name\": \"Alice\" }",[19,3093,3094,3097],{},[32,3095,3096],{},"Value types",[16,3098,3099,3105],{},[19,3100,3101,3102,3104],{},"JS: Can include functions, dates, regular expressions, ",[78,3103,2512],{},", etc.",[19,3106,3107,3108],{},"JSON: Only objects, arrays, strings, numbers, booleans, and ",[78,3109,314],{},[19,3111,3112,3115],{},[32,3113,3114],{},"Comments",[16,3116,3117,3126],{},[19,3118,3119,3120,109,3123],{},"JS: Supports ",[78,3121,3122],{},"\u002F\u002F",[78,3124,3125],{},"\u002F* *\u002F",[19,3127,3128],{},"JSON: Does not support any comments",[19,3130,3131,3134],{},[32,3132,3133],{},"Quote style",[16,3135,3136,3139],{},[19,3137,3138],{},"JS: Strings can use single or double quotes",[19,3140,3141],{},"JSON: Only double quotes are allowed",[12,3143,3144,3145,175],{},"Therefore, you cannot simply treat a JS object as JSON and send it to the backend; you need to serialize it using ",[78,3146,3147],{},"JSON.stringify()",[52,3149,3151],{"id":3150},"practical-tips-how-to-use-json-effectively-in-your-projects","Practical Tips: How to Use JSON Effectively in Your Projects?",[1172,3153,3154,3177,3195],{},[19,3155,3156,3159],{},[32,3157,3158],{},"API Design Phase",[16,3160,3161,3171,3174],{},[19,3162,3163,3164,3166,3167,3166,3169,1287],{},"Standardize response structures (e.g., ",[78,3165,101],{}," + ",[78,3168,108],{},[78,3170,112],{},[19,3172,3173],{},"Specify that dates and times use ISO 8601 strings.",[19,3175,3176],{},"Avoid returning sensitive information in JSON (keys, internal IDs, debug info).",[19,3178,3179,3182],{},[32,3180,3181],{},"Frontend Handling",[16,3183,3184,3189,3192],{},[19,3185,1186,3186,3188],{},[78,3187,898],{}," and status codes before parsing.",[19,3190,3191],{},"Paginate or lazy-load large JSON to avoid parsing huge payloads at once.",[19,3193,3194],{},"Use TypeScript or JSON Schema to enforce type constraints on API data structures.",[19,3196,3197,3200],{},[32,3198,3199],{},"Debugging and Troubleshooting",[16,3201,3202,3209],{},[19,3203,3204,3205,3208],{},"When encountering a ",[78,3206,3207],{},"SyntaxError",", first format the JSON with a tool, then locate the error line based on the hint.",[19,3210,3211],{},"Be cautious with \"strings that look like JSON\", especially those copied from logs or third-party documentation.",[37,3213,3214],{},[12,3215,3216,3217,3219],{},"If you frequently need to check and format JSON, bookmark our ",[43,3218,46],{"href":45}," to quickly validate any JSON snippet.",[52,3221,954],{"id":953},[16,3223,3224,3227,3230,3233],{},[19,3225,3226],{},"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.",[19,3228,3229],{},"Common mistakes often come from \"writing like JavaScript objects\" instead of \"following the JSON spec strictly\": single quotes, trailing commas, comments, invalid values, etc.",[19,3231,3232],{},"In real projects, you need to consider API design, frontend parsing, and error handling together, not just the \"syntax level\".",[19,3234,3235],{},"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":76,"searchDepth":978,"depth":978,"links":3237},[3238,3239,3240,3245,3251,3260,3265,3266,3267],{"id":2407,"depth":978,"text":2408},{"id":2448,"depth":978,"text":2449},{"id":2522,"depth":978,"text":2523,"children":3241},[3242,3243,3244],{"id":2526,"depth":983,"text":2527},{"id":2560,"depth":983,"text":2561},{"id":2573,"depth":983,"text":2574},{"id":2592,"depth":978,"text":2593,"children":3246},[3247,3248,3249,3250],{"id":2596,"depth":983,"text":2459},{"id":2626,"depth":983,"text":2468},{"id":2647,"depth":983,"text":2648},{"id":2681,"depth":983,"text":2682},{"id":2691,"depth":978,"text":2692,"children":3252},[3253,3254,3255,3256,3258,3259],{"id":2698,"depth":983,"text":2699},{"id":2736,"depth":983,"text":2737},{"id":2785,"depth":983,"text":2786},{"id":2829,"depth":983,"text":3257},"Using Invalid Values: undefined, Functions, Date Objects, etc.",{"id":2867,"depth":983,"text":2868},{"id":2918,"depth":983,"text":2919},{"id":2990,"depth":978,"text":2991,"children":3261},[3262,3263,3264],{"id":2994,"depth":983,"text":2995},{"id":3022,"depth":983,"text":3023},{"id":3035,"depth":983,"text":3036},{"id":3065,"depth":978,"text":3066},{"id":3150,"depth":978,"text":3151},{"id":953,"depth":978,"text":954},"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",[1028,1029],{},"\u002Fen\u002Fblog\u002Fwhat-is-json",{"slug":1033,"text":3275,"btn":1035},"🚀 Skip straight to formatting\u002Fvalidating your JSON:",{"title":2385,"description":3269},"en\u002Fblog\u002Fwhat-is-json",[1039,46,2379,2380,3279],"Web Development","VfC-Ya_C_EBjdy1ftjp5NquHkAIO2AB0Eka1mtelg9w",{"id":3282,"title":3283,"author":7,"body":3284,"category":1020,"date":1021,"description":4214,"draft":1023,"extension":1024,"h1":1025,"image":4215,"lastmod":1021,"locales":4216,"meta":4217,"navigation":856,"path":4218,"promo":4219,"seo":4222,"stem":4223,"tags":4224,"__hash__":4225},"blog\u002Fzh\u002Fblog\u002Fjson-best-practices.md","前后端项目中 JSON 的最佳实践：接口设计、性能与安全",{"type":9,"value":3285,"toc":4173},[3286,3289,3300,3307,3315,3317,3321,3325,3328,3333,3338,3343,3348,3351,3374,3378,3384,3389,3392,3397,3400,3404,3410,3433,3436,3447,3449,3453,3457,3460,3476,3479,3494,3501,3505,3508,3513,3516,3524,3526,3540,3544,3546,3595,3597,3605,3607,3611,3615,3618,3624,3626,3634,3637,3648,3652,3655,3663,3666,3677,3680,3688,3692,3695,3701,3703,3711,3713,3717,3721,3724,3743,3746,3751,3753,3764,3768,3771,3787,3790,3795,3798,3802,3805,3833,3835,3840,3842,3846,3850,3853,3858,3860,3868,3872,3875,3880,3883,3885,3889,3893,3899,3907,3909,3914,3918,3921,3926,3928,3936,3938,3942,3946,3949,3954,3957,3965,3967,3979,3983,3985,3990,3992,4000,4002,4010,4014,4016,4021,4023,4031,4033,4041,4043,4047,4050,4083,4086,4122,4125,4146,4148,4151,4165],[12,3287,3288],{},"在大多数 Web 项目中，JSON 已经是事实上的数据交换标准。但“会用 JSON”和“用好 JSON”是两回事：",[16,3290,3291,3294,3297],{},[19,3292,3293],{},"接口返回结构混乱，前端难以维护；",[19,3295,3296],{},"大 JSON 导致页面卡顿、接口超时；",[19,3298,3299],{},"敏感信息无意中被写进响应，带来安全风险。",[12,3301,3302,3303,3306],{},"这篇文章从",[32,3304,3305],{},"接口设计、性能优化、安全实践","三个维度，总结在真实项目中使用 JSON 的规范、反模式与检查清单，帮助你构建更稳健的前后端系统。",[37,3308,3309],{},[12,3310,3311,3312,3314],{},"如果你正在设计或重构接口，可以把示例 JSON 粘贴到首页的 ",[43,3313,46],{"href":45}," 中，一边调整结构，一边实时查看格式与合法性。",[49,3316],{},[52,3318,3320],{"id":3319},"一统一接口响应结构设计","一、统一接口响应结构设计",[57,3322,3324],{"id":3323},"_1-推荐的基础结构","1. 推荐的基础结构",[12,3326,3327],{},"对于大多数业务接口，推荐使用统一的顶层结构，例如：",[12,3329,3330],{},[32,3331,3332],{},"成功响应：",[70,3334,3336],{"className":3335,"code":74,"language":75,"meta":76},[73],[78,3337,74],{"__ignoreMap":76},[12,3339,3340],{},[32,3341,3342],{},"错误响应：",[70,3344,3346],{"className":3345,"code":88,"language":75,"meta":76},[73],[78,3347,88],{"__ignoreMap":76},[12,3349,3350],{},"好处：",[16,3352,3353,3359,3369],{},[19,3354,3355,3356,3358],{},"前端只需判断 ",[78,3357,101],{}," 字段，即可区分成功\u002F错误。",[19,3360,3361,607,3363,3365,3366,3368],{},[78,3362,108],{},[78,3364,112],{}," 分离，避免在错误时访问不存在的 ",[78,3367,108],{}," 字段。",[19,3370,3371,3373],{},[78,3372,121],{}," 中可放置追踪 ID、版本号等，便于日志和监控。",[57,3375,3377],{"id":3376},"_2-列表接口与分页结构","2. 列表接口与分页结构",[12,3379,3380,3381,3383],{},"对于列表接口，推荐在 ",[78,3382,108],{}," 中使用数组，并配合统一的分页结构：",[70,3385,3387],{"className":3386,"code":136,"language":75,"meta":76},[73],[78,3388,136],{"__ignoreMap":76},[12,3390,3391],{},"或游标分页（适合大数据量）：",[70,3393,3395],{"className":3394,"code":145,"language":75,"meta":76},[73],[78,3396,145],{"__ignoreMap":76},[12,3398,3399],{},"前端可以基于此封装统一的列表组件和分页逻辑。",[57,3401,3403],{"id":3402},"_3-错误码设计建议","3. 错误码设计建议",[12,3405,3406,3407,3409],{},"在 ",[78,3408,112],{}," 对象中，建议至少包含：",[16,3411,3412,3423,3428],{},[19,3413,3414,3416,3417,3419,3420,3422],{},[78,3415,78],{},"：机器可读的错误码，如 ",[78,3418,170],{},"、",[78,3421,174],{},"。",[19,3424,3425,3427],{},[78,3426,180],{},"：人类可读的错误描述，可用于前端展示。",[19,3429,3430,3432],{},[78,3431,186],{},"（可选）：结构化详情，便于前端做更细粒度的处理或日志记录。",[12,3434,3435],{},"避免：",[16,3437,3438,3444],{},[19,3439,3440,3441,3443],{},"只在响应中返回一个字符串：",[78,3442,198],{},"，前端难以区分错误类型。",[19,3445,3446],{},"把完整堆栈信息直接返回给前端（安全风险）。",[49,3448],{},[52,3450,3452],{"id":3451},"二字段命名与类型约定","二、字段命名与类型约定",[57,3454,3456],{"id":3455},"_1-命名风格camelcase-vs-snake_case","1. 命名风格：camelCase vs snake_case",[12,3458,3459],{},"在 JSON 中，常见两种命名风格：",[16,3461,3462,3469],{},[19,3463,3464,3465,171,3467],{},"camelCase：",[78,3466,223],{},[78,3468,226],{},[19,3470,3471,3472,171,3474],{},"snake_case：",[78,3473,232],{},[78,3475,235],{},[12,3477,3478],{},"建议：",[16,3480,3481,3488,3491],{},[19,3482,3483,3484,3487],{},"在一个项目中",[32,3485,3486],{},"统一一种风格","，并在团队内形成约定。",[19,3489,3490],{},"若前端以 JavaScript\u002FTypeScript 为主，通常更习惯 camelCase。",[19,3492,3493],{},"若后端重度依赖某些框架（如 Django 默认 snake_case），可在序列化层统一转换。",[12,3495,3496,3497,3500],{},"关键是：",[32,3498,3499],{},"对外接口保持一致","，避免同一接口中混用两种风格。",[57,3502,3504],{"id":3503},"_2-日期与时间统一使用-iso-8601","2. 日期与时间：统一使用 ISO 8601",[12,3506,3507],{},"推荐所有日期\u002F时间字段使用 ISO 8601 字符串，例如：",[70,3509,3511],{"className":3510,"code":270,"language":75,"meta":76},[73],[78,3512,270],{"__ignoreMap":76},[12,3514,3515],{},"优点：",[16,3517,3518,3521],{},[19,3519,3520],{},"语言无关，几乎所有语言都有成熟的解析库。",[19,3522,3523],{},"明确包含时区信息，避免“本地时间 vs UTC”歧义。",[12,3525,3435],{},[16,3527,3528,3534],{},[19,3529,3530,3531,3533],{},"使用时间戳数字（",[78,3532,292],{},"）却不注明单位（秒\u002F毫秒）。",[19,3535,3536,3537,3539],{},"使用自定义格式（",[78,3538,299],{},"），增加前端解析成本。",[57,3541,3543],{"id":3542},"_3-null空对象空数组的使用","3. null、空对象、空数组的使用",[12,3545,3478],{},[16,3547,3548,3559,3567],{},[19,3549,3550,3551,3553,3554],{},"对“不存在”的标量字段，使用 ",[78,3552,314],{},"：\n",[70,3555,3557],{"className":3556,"code":319,"language":75,"meta":76},[73],[78,3558,319],{"__ignoreMap":76},[19,3560,3561,3562],{},"对“列表为空”，使用空数组：\n",[70,3563,3565],{"className":3564,"code":328,"language":75,"meta":76},[73],[78,3566,328],{"__ignoreMap":76},[19,3568,3569,3570,3590,3591,3594],{},"对“对象不存在”，有两种常见策略：\n",[16,3571,3572,3582],{},[19,3573,3574,3575,3553,3577],{},"返回 ",[78,3576,314],{},[70,3578,3580],{"className":3579,"code":344,"language":75,"meta":76},[73],[78,3581,344],{"__ignoreMap":76},[19,3583,3584,3585],{},"返回空对象：\n",[70,3586,3588],{"className":3587,"code":353,"language":75,"meta":76},[73],[78,3589,353],{"__ignoreMap":76},"\n关键是：",[32,3592,3593],{},"在项目中统一一种策略","，并在文档中说明。",[12,3596,3435],{},[16,3598,3599],{},[19,3600,3601,3602,3604],{},"有时返回 ",[78,3603,314],{},"，有时直接省略字段，导致前端需要多重判断。",[49,3606],{},[52,3608,3610],{"id":3609},"三性能相关实践","三、性能相关实践",[57,3612,3614],{"id":3613},"_1-精简返回字段","1. 精简返回字段",[12,3616,3617],{},"只返回前端真正需要的字段，避免“一把梭”返回整张表：",[70,3619,3622],{"className":3620,"code":3621,"language":75,"meta":76},[73],"\u002F\u002F 避免\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 推荐\n{\n  \"id\": 1,\n  \"name\": \"Alice\",\n  \"email\": \"alice@example.com\"\n}\n",[78,3623,3621],{"__ignoreMap":76},[12,3625,3350],{},[16,3627,3628,3631],{},[19,3629,3630],{},"减少传输体积，加快接口响应。",[19,3632,3633],{},"降低敏感信息泄露风险。",[12,3635,3636],{},"实现方式：",[16,3638,3639,3642],{},[19,3640,3641],{},"在后端使用 DTO\u002FVO（Data Transfer Object \u002F View Object）层，只暴露必要字段。",[19,3643,3644,3645,3647],{},"对复杂对象，支持 ",[78,3646,413],{}," 查询参数，让前端按需选择字段（适合开放 API）。",[57,3649,3651],{"id":3650},"_2-大列表分页与流式处理","2. 大列表：分页与流式处理",[12,3653,3654],{},"对可能很大的列表：",[16,3656,3657,3660],{},[19,3658,3659],{},"必须使用分页（页码或游标）。",[19,3661,3662],{},"避免一次性返回几万条记录。",[12,3664,3665],{},"后端：",[16,3667,3668,3674],{},[19,3669,3670,3671,3673],{},"使用数据库分页（",[78,3672,440],{}," 或游标）。",[19,3675,3676],{},"对特别大的导出接口，考虑异步任务 + 文件下载，而不是同步返回大 JSON。",[12,3678,3679],{},"前端：",[16,3681,3682,3685],{},[19,3683,3684],{},"使用虚拟列表\u002F懒加载，避免一次性渲染大量 DOM。",[19,3686,3687],{},"对超大 JSON，避免在主线程中做复杂计算，可考虑 Web Worker。",[57,3689,3691],{"id":3690},"_3-减少嵌套深度与冗余","3. 减少嵌套深度与冗余",[12,3693,3694],{},"过深的嵌套和大量冗余字段会增加解析成本：",[70,3696,3699],{"className":3697,"code":3698,"language":75,"meta":76},[73],"\u002F\u002F 避免：过深嵌套 + 冗余\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 推荐：扁平一些，只保留必要结构\n{\n  \"data\": {\n    \"userId\": 1,\n    \"name\": \"Alice\"\n  }\n}\n",[78,3700,3698],{"__ignoreMap":76},[12,3702,3478],{},[16,3704,3705,3708],{},[19,3706,3707],{},"一般嵌套深度控制在 3–5 层以内。",[19,3709,3710],{},"定期审查接口响应，删除不再使用的字段。",[49,3712],{},[52,3714,3716],{"id":3715},"四安全相关实践","四、安全相关实践",[57,3718,3720],{"id":3719},"_1-避免在-json-中暴露敏感信息","1. 避免在 JSON 中暴露敏感信息",[12,3722,3723],{},"常见但危险的实践：",[16,3725,3726],{},[19,3727,3728,3729],{},"在响应中返回：\n",[16,3730,3731,3734,3737,3740],{},[19,3732,3733],{},"密码或密码哈希",[19,3735,3736],{},"内部密钥、token",[19,3738,3739],{},"完整堆栈信息",[19,3741,3742],{},"内部 ID、内部服务地址",[12,3744,3745],{},"示例（错误）：",[70,3747,3749],{"className":3748,"code":517,"language":75,"meta":76},[73],[78,3750,517],{"__ignoreMap":76},[12,3752,3478],{},[16,3754,3755,3758],{},[19,3756,3757],{},"使用专门的“公开视图”对象，只包含可暴露字段。",[19,3759,3760,3761,3763],{},"对错误响应，使用通用错误信息，不在 ",[78,3762,180],{}," 中暴露堆栈或内部细节。",[57,3765,3767],{"id":3766},"_2-对用户输入做校验后再解析","2. 对用户输入做校验后再解析",[12,3769,3770],{},"对来自用户或第三方的 JSON 数据：",[16,3772,3773,3776,3779],{},[19,3774,3775],{},"先做长度限制（例如最大 1MB）。",[19,3777,3778],{},"再做基本字符校验（例如只允许 printable UTF-8）。",[19,3780,3781,3782,3784,3785,3422],{},"再用 ",[78,3783,556],{}," 包裹 ",[78,3786,552],{},[12,3788,3789],{},"Node.js 示例：",[70,3791,3793],{"className":3792,"code":564,"language":565,"meta":76},[563],[78,3794,564],{"__ignoreMap":76},[12,3796,3797],{},"对关键业务数据，可进一步使用 JSON Schema \u002F Zod \u002F Joi 做结构校验。",[57,3799,3801],{"id":3800},"_3-日志中的脱敏","3. 日志中的脱敏",[12,3803,3804],{},"在服务器日志中记录请求\u002F响应 JSON 时：",[16,3806,3807],{},[19,3808,3809,3810],{},"对敏感字段进行脱敏：\n",[16,3811,3812,3818,3824],{},[19,3813,3814,590,3816],{},[78,3815,589],{},[78,3817,593],{},[19,3819,3820,590,3822],{},[78,3821,598],{},[78,3823,601],{},[19,3825,3826,607,3828,3830,3831,3422],{},[78,3827,606],{},[78,3829,610],{},"：直接不记录或记录为 ",[78,3832,614],{},[12,3834,3435],{},[16,3836,3837],{},[19,3838,3839],{},"将完整请求\u002F响应原样写入日志，尤其是包含认证信息、支付信息时。",[49,3841],{},[52,3843,3845],{"id":3844},"五与-typescript-json-schema-的结合","五、与 TypeScript \u002F JSON Schema 的结合",[57,3847,3849],{"id":3848},"_1-使用-typescript-定义接口类型","1. 使用 TypeScript 定义接口类型",[12,3851,3852],{},"在 TypeScript 项目中，为每个接口定义明确的类型：",[70,3854,3856],{"className":3855,"code":639,"language":640,"meta":76},[638],[78,3857,639],{"__ignoreMap":76},[12,3859,3350],{},[16,3861,3862,3865],{},[19,3863,3864],{},"前端在编译期就能发现字段名错误、类型不匹配等问题。",[19,3866,3867],{},"配合自动补全，提高开发效率。",[57,3869,3871],{"id":3870},"_2-使用-json-schema-做运行时校验","2. 使用 JSON Schema 做运行时校验",[12,3873,3874],{},"对第三方数据或关键接口，可使用 JSON Schema 定义结构，并在运行时校验：",[70,3876,3878],{"className":3877,"code":663,"language":75,"meta":76},[73],[78,3879,663],{"__ignoreMap":76},[12,3881,3882],{},"配合校验库，可在运行时拦截不符合预期的响应，提前暴露问题。",[49,3884],{},[52,3886,3888],{"id":3887},"六配置与日志中的-json","六、配置与日志中的 JSON",[57,3890,3892],{"id":3891},"_1-配置文件严格-json-或-jsonc","1. 配置文件：严格 JSON 或 JSONC",[12,3894,3895,3896,3898],{},"对于配置文件（如 ",[78,3897,684],{},"）：",[16,3900,3901,3904],{},[19,3902,3903],{},"优先使用严格 JSON，避免注释和尾部逗号。",[19,3905,3906],{},"如果确实需要注释，可使用 JSONC（带注释的 JSON），但要确保解析器支持。",[12,3908,3435],{},[16,3910,3911],{},[19,3912,3913],{},"在配置中混用单引号、注释、尾部逗号，导致不同环境解析行为不一致。",[57,3915,3917],{"id":3916},"_2-结构化日志的字段规范","2. 结构化日志的字段规范",[12,3919,3920],{},"对于结构化日志（JSON Logs），建议统一字段约定，例如：",[70,3922,3924],{"className":3923,"code":711,"language":75,"meta":76},[73],[78,3925,711],{"__ignoreMap":76},[12,3927,3350],{},[16,3929,3930,3933],{},[19,3931,3932],{},"方便在 ELK \u002F Cloudflare Logs 等系统中查询和聚合。",[19,3934,3935],{},"统一字段后，可以更容易地做告警和仪表盘。",[49,3937],{},[52,3939,3941],{"id":3940},"七常见反模式anti-patterns","七、常见反模式（Anti-Patterns）",[57,3943,3945],{"id":3944},"_1-在-json-中塞-html-富文本而不说明","1. 在 JSON 中塞 HTML \u002F 富文本而不说明",[12,3947,3948],{},"例如：",[70,3950,3952],{"className":3951,"code":740,"language":75,"meta":76},[73],[78,3953,740],{"__ignoreMap":76},[12,3955,3956],{},"问题：",[16,3958,3959,3962],{},[19,3960,3961],{},"前端如果不清楚这是 HTML，可能直接当普通文本展示。",[19,3963,3964],{},"存在 XSS 风险，如果未做转义就直接插入 DOM。",[12,3966,3478],{},[16,3968,3969,3976],{},[19,3970,3971,3972,3419,3974,3422],{},"明确字段语义，如 ",[78,3973,763],{},[78,3975,766],{},[19,3977,3978],{},"前端根据字段名决定是否以 HTML 渲染，并做好转义\u002F过滤。",[57,3980,3982],{"id":3981},"_2-用-json-传超大二进制","2. 用 JSON 传超大二进制",[12,3984,3948],{},[16,3986,3987],{},[19,3988,3989],{},"把图片、文件内容 base64 编码后放在 JSON 字段中。",[12,3991,3956],{},[16,3993,3994,3997],{},[19,3995,3996],{},"体积膨胀（base64 约增加 33%）。",[19,3998,3999],{},"解析和传输成本都很高。",[12,4001,3478],{},[16,4003,4004,4007],{},[19,4005,4006],{},"使用专门的文件上传接口，返回文件 URL 或 ID。",[19,4008,4009],{},"JSON 中只保留元数据（URL、大小、类型等）。",[57,4011,4013],{"id":4012},"_3-返回半-json-半文本的混合内容","3. 返回“半 JSON 半文本”的混合内容",[12,4015,3948],{},[70,4017,4019],{"className":4018,"code":811,"language":812,"meta":76},[810],[78,4020,811],{"__ignoreMap":76},[12,4022,3956],{},[16,4024,4025,4028],{},[19,4026,4027],{},"无法直接用标准 JSON 解析器处理。",[19,4029,4030],{},"容易在调试时“看起来没问题”，一到生产就报错。",[12,4032,3478],{},[16,4034,4035,4038],{},[19,4036,4037],{},"要么纯 JSON，要么纯 HTML\u002F文本，不要混用。",[19,4039,4040],{},"调试信息通过专门的 header 或日志系统输出，而不是拼在响应体中。",[49,4042],{},[52,4044,4046],{"id":4045},"八检查清单checklist","八、检查清单（Checklist）",[57,4048,4049],{"id":4049},"接口设计阶段",[16,4051,4053,4059,4065,4071,4077],{"className":4052},[848],[19,4054,4056,4058],{"className":4055},[852],[854,4057],{"disabled":856,"type":857}," 是否统一了成功\u002F错误响应结构？",[19,4060,4062,4064],{"className":4061},[852],[854,4063],{"disabled":856,"type":857}," 是否定义了统一的错误码规范？",[19,4066,4068,4070],{"className":4067},[852],[854,4069],{"disabled":856,"type":857}," 日期\u002F时间是否统一使用 ISO 8601？",[19,4072,4074,4076],{"className":4073},[852],[854,4075],{"disabled":856,"type":857}," 字段命名风格（camelCase \u002F snake_case）是否统一？",[19,4078,4080,4082],{"className":4079},[852],[854,4081],{"disabled":856,"type":857}," 是否避免了在响应中返回敏感字段？",[57,4084,4085],{"id":4085},"前端解析阶段",[16,4087,4089,4098,4110,4116],{"className":4088},[848],[19,4090,4092,4094,4095,4097],{"className":4091},[852],[854,4093],{"disabled":856,"type":857}," 是否先检查状态码和 ",[78,4096,898],{}," 再解析？",[19,4099,4101,4103,4104,4106,4107,4109],{"className":4100},[852],[854,4102],{"disabled":856,"type":857}," 是否对所有 ",[78,4105,552],{}," 使用 ",[78,4108,556],{},"？",[19,4111,4113,4115],{"className":4112},[852],[854,4114],{"disabled":856,"type":857}," 是否对大 JSON 做了分页\u002F懒加载处理？",[19,4117,4119,4121],{"className":4118},[852],[854,4120],{"disabled":856,"type":857}," 是否对第三方\u002F用户输入做了长度和结构校验？",[57,4123,4124],{"id":4124},"日志与安全",[16,4126,4128,4134,4140],{"className":4127},[848],[19,4129,4131,4133],{"className":4130},[852],[854,4132],{"disabled":856,"type":857}," 日志中的敏感字段是否已脱敏？",[19,4135,4137,4139],{"className":4136},[852],[854,4138],{"disabled":856,"type":857}," 是否避免了在错误响应中返回堆栈信息？",[19,4141,4143,4145],{"className":4142},[852],[854,4144],{"disabled":856,"type":857}," 配置文件是否使用严格 JSON 或受控的 JSONC？",[49,4147],{},[52,4149,4150],{"id":4150},"小结",[16,4152,4153,4156,4159,4162],{},[19,4154,4155],{},"在前后端项目中，“用好 JSON”不仅仅是语法正确，更关乎接口设计、性能和安全。",[19,4157,4158],{},"统一响应结构、字段规范和错误码，可以显著降低前后端协作成本。",[19,4160,4161],{},"通过精简字段、分页、流式处理等手段，可以有效优化大 JSON 带来的性能问题。",[19,4163,4164],{},"在安全方面，避免敏感信息泄露、做好输入校验和日志脱敏，是基本但常被忽视的实践。",[37,4166,4167],{},[12,4168,4169,4170,4172],{},"在设计和调试接口时，可以把示例 JSON 粘贴到 ",[43,4171,46],{"href":45}," 中，一边调整结构，一边实时检查格式与合法性，帮助团队更快达成共识。",{"title":76,"searchDepth":978,"depth":978,"links":4174},[4175,4180,4185,4190,4195,4199,4203,4208,4213],{"id":3319,"depth":978,"text":3320,"children":4176},[4177,4178,4179],{"id":3323,"depth":983,"text":3324},{"id":3376,"depth":983,"text":3377},{"id":3402,"depth":983,"text":3403},{"id":3451,"depth":978,"text":3452,"children":4181},[4182,4183,4184],{"id":3455,"depth":983,"text":3456},{"id":3503,"depth":983,"text":3504},{"id":3542,"depth":983,"text":3543},{"id":3609,"depth":978,"text":3610,"children":4186},[4187,4188,4189],{"id":3613,"depth":983,"text":3614},{"id":3650,"depth":983,"text":3651},{"id":3690,"depth":983,"text":3691},{"id":3715,"depth":978,"text":3716,"children":4191},[4192,4193,4194],{"id":3719,"depth":983,"text":3720},{"id":3766,"depth":983,"text":3767},{"id":3800,"depth":983,"text":3801},{"id":3844,"depth":978,"text":3845,"children":4196},[4197,4198],{"id":3848,"depth":983,"text":3849},{"id":3870,"depth":983,"text":3871},{"id":3887,"depth":978,"text":3888,"children":4200},[4201,4202],{"id":3891,"depth":983,"text":3892},{"id":3916,"depth":983,"text":3917},{"id":3940,"depth":978,"text":3941,"children":4204},[4205,4206,4207],{"id":3944,"depth":983,"text":3945},{"id":3981,"depth":983,"text":3982},{"id":4012,"depth":983,"text":4013},{"id":4045,"depth":978,"text":4046,"children":4209},[4210,4211,4212],{"id":4049,"depth":983,"text":4049},{"id":4085,"depth":983,"text":4085},{"id":4124,"depth":983,"text":4124},{"id":4150,"depth":978,"text":4150},"从接口设计、性能优化到安全实践，总结在真实项目中使用 JSON 的规范、反模式与检查清单。","\u002Fblog\u002Fcover\u002Fzh\u002Fjson-best-practices-cover.svg",[1029,1028],{},"\u002Fzh\u002Fblog\u002Fjson-best-practices",{"slug":1033,"text":4220,"btn":4221},"🚀 需要批量格式化\u002F检查 JSON？","打开 JSON Editor",{"title":3283,"description":4214},"zh\u002Fblog\u002Fjson-best-practices",[1039,46,1040,1041,1042],"re0USpapMkRJOKqJJWbjkYGkiuwQCqnt4dK-bUS5Y3M",{"id":4227,"title":4228,"author":1047,"body":4229,"category":1020,"date":2367,"description":5485,"draft":1023,"extension":1024,"h1":1025,"image":5486,"lastmod":2370,"locales":5487,"meta":5488,"navigation":856,"path":5489,"promo":5490,"seo":5492,"stem":5493,"tags":5494,"__hash__":5495},"blog\u002Fzh\u002Fblog\u002Fjson-parse-error-debug.md","JSON 解析失败怎么办？接口调试中的 10 个典型错误与排查步骤",{"type":9,"value":4230,"toc":5416},[4231,4244,4252,4255,4258,4280,4283,4291,4294,4296,4300,4303,4317,4323,4326,4338,4341,4378,4381,4408,4410,4416,4419,4436,4439,4455,4458,4473,4476,4493,4495,4499,4502,4524,4527,4559,4562,4576,4579,4587,4589,4593,4596,4618,4621,4631,4634,4668,4671,4690,4692,4696,4699,4702,4726,4729,4740,4743,4755,4758,4782,4784,4788,4791,4802,4805,4813,4816,4824,4827,4841,4843,4847,4850,4864,4867,4872,4875,4899,4902,4910,4912,4916,4919,4941,4944,4952,4955,4963,4966,5009,5011,5015,5018,5036,5039,5047,5050,5058,5061,5072,5074,5080,5083,5093,5096,5104,5107,5132,5135,5171,5177,5179,5183,5186,5262,5264,5268,5370,5372,5374,5385,5393,5396],[12,4232,4233,4234,4236,4237,4239,4240,4243],{},"在前后端开发中，“JSON 解析失败”几乎是最常见的错误之一：前端调用接口，期望拿到 JSON，结果 ",[78,4235,552],{}," 抛出异常，控制台一片红。",[1057,4238],{},"\n这篇文章从真实开发场景出发，总结 ",[32,4241,4242],{},"10 类典型 JSON 解析错误","，并给出可操作的排查步骤和预防建议，帮助你快速定位问题、减少调试时间。",[37,4245,4246],{},[12,4247,4248,4249,4251],{},"如果你手边正好有一段”解析失败”的 JSON，可以先把它粘贴到 ",[43,4250,46],{"href":1071}," 中，自动检查语法并查看错误位置。",[52,4253,4254],{"id":4254},"典型错误信息总览",[12,4256,4257],{},"在不同环境和场景中，你可能会看到类似的报错：",[16,4259,4260,4264,4268,4272,4276],{},[19,4261,4262],{},[78,4263,1086],{},[19,4265,4266],{},[78,4267,1091],{},[19,4269,4270],{},[78,4271,1096],{},[19,4273,4274],{},[78,4275,1101],{},[19,4277,4278],{},[78,4279,1106],{},[12,4281,4282],{},"这些错误信息的共同点是：",[16,4284,4285,4288],{},[19,4286,4287],{},"都说明“输入不是合法的 JSON”；",[19,4289,4290],{},"但真正原因可能完全不同：有的是格式错误，有的是接口返回了 HTML，有的是编码问题。",[12,4292,4293],{},"下面按场景分类，逐一拆解。",[49,4295],{},[52,4297,4299],{"id":4298},"场景-1后端返回了-html-错误页500404","场景 1：后端返回了 HTML 错误页（500\u002F404）",[57,4301,4302],{"id":4302},"现象",[16,4304,4305,4308,4311],{},[19,4306,4307],{},"前端调用接口，期望 JSON 响应。",[19,4309,4310],{},"实际状态码是 500\u002F404\u002F503 等，Body 是 HTML 错误页。",[19,4312,4313,4314,4316],{},"前端仍然执行 ",[78,4315,1140],{},"，报错：",[37,4318,4319],{},[12,4320,4321],{},[78,4322,1091],{},[57,4324,4325],{"id":4325},"原因",[12,4327,4328,4329,4331,4332,4334,4335,4337],{},"HTML 通常以 ",[78,4330,1157],{}," 或 ",[78,4333,1161],{}," 开头，第一个字符是 ",[78,4336,1165],{},"，不是合法 JSON。",[57,4339,4340],{"id":4340},"排查步骤",[1172,4342,4343,4346,4352,4373],{},[19,4344,4345],{},"打开浏览器 Network 面板，找到该请求。",[19,4347,4348,4349,4351],{},"查看 ",[32,4350,1182],{},"：是否为 2xx？",[19,4353,4348,4354,4356,4357,3553,4359],{},[32,4355,1191],{}," 中的 ",[78,4358,898],{},[16,4360,4361,4366],{},[19,4362,4363,4364,4109],{},"是否为 ",[78,4365,1199],{},[19,4367,4368,4369,607,4371,4109],{},"还是 ",[78,4370,1205],{},[78,4372,1208],{},[19,4374,4348,4375,4377],{},[32,4376,1214],{},"：是否是 HTML 错误页？",[57,4379,4380],{"id":4380},"解决方式",[16,4382,4383,4402],{},[19,4384,4385,4386,4388,4389],{},"前端在 ",[78,4387,552],{}," 之前：\n",[16,4390,4391,4394],{},[19,4392,4393],{},"先检查状态码是否为 2xx；",[19,4395,4396,4397,4399,4400,3422],{},"再检查 ",[78,4398,898],{}," 是否包含 ",[78,4401,1199],{},[19,4403,4404,4405,4407],{},"对非 2xx 响应，优先展示错误信息（例如 ",[78,4406,1246],{},"），而不是尝试解析 JSON。",[49,4409],{},[52,4411,4413,4414],{"id":4412},"场景-2content-type-不是-applicationjson","场景 2：Content-Type 不是 ",[78,4415,1199],{},[57,4417,4302],{"id":4418},"现象-1",[16,4420,4421,4431],{},[19,4422,4423,4424,4426,4427,4331,4429,3422],{},"接口返回的内容“看起来像 JSON”，但 ",[78,4425,898],{}," 是 ",[78,4428,1205],{},[78,4430,1208],{},[19,4432,4433,4434,3422],{},"某些框架\u002F中间件会因此拒绝自动解析，或你在代码中不敢放心 ",[78,4435,552],{},[57,4437,4325],{"id":4438},"原因-1",[16,4440,4441,4447,4450],{},[19,4442,4443,4444,4446],{},"后端框架配置问题（例如默认返回 ",[78,4445,1205],{},"）。",[19,4448,4449],{},"反向代理\u002F网关修改了响应头。",[19,4451,4452,4453,3422],{},"某些错误处理中间件统一返回 ",[78,4454,1205],{},[57,4456,4340],{"id":4457},"排查步骤-1",[1172,4459,4460,4465,4468],{},[19,4461,4462,4463,3422],{},"在 Network 面板查看 ",[78,4464,898],{},[19,4466,4467],{},"对比正常接口与异常接口的响应头差异。",[19,4469,4470,4471,3422],{},"检查后端代码\u002F配置中是否显式设置了 ",[78,4472,898],{},[57,4474,4380],{"id":4475},"解决方式-1",[16,4477,4478,4487],{},[19,4479,4480,4481,4483,4484,4486],{},"后端统一返回 ",[78,4482,1326],{},"，并以 UTF-8 编码输出 body。很多框架也会输出 ",[78,4485,1330],{},"；关键是响应 body 必须是合法 JSON，且编码一致。",[19,4488,4489,4490,4492],{},"前端对非 ",[78,4491,1199],{}," 的响应，谨慎解析，或先记录日志再处理。",[49,4494],{},[52,4496,4498],{"id":4497},"场景-3多余逗号-单引号-注释伪-json","场景 3：多余逗号 \u002F 单引号 \u002F 注释（“伪 JSON”）",[57,4500,4302],{"id":4501},"现象-2",[16,4503,4504,4507],{},[19,4505,4506],{},"从日志、文档、聊天工具中复制了一段“看起来像 JSON”的内容。",[19,4508,4509,4510],{},"粘贴到代码或工具中解析，报错：\n",[16,4511,4512,4516,4520],{},[19,4513,4514],{},[78,4515,1364],{},[19,4517,4518],{},[78,4519,1369],{},[19,4521,4522],{},[78,4523,1374],{},[57,4525,4526],{"id":4526},"常见错误形式",[1172,4528,4529,4539,4549],{},[19,4530,4531,4534],{},[32,4532,4533],{},"末尾多余逗号",[70,4535,4537],{"className":4536,"code":1389,"language":75,"meta":76},[73],[78,4538,1389],{"__ignoreMap":76},[19,4540,4541,4544],{},[32,4542,4543],{},"使用单引号",[70,4545,4547],{"className":4546,"code":1400,"language":75,"meta":76},[73],[78,4548,1400],{"__ignoreMap":76},[19,4550,4551,4554],{},[32,4552,4553],{},"在 JSON 中写注释",[70,4555,4557],{"className":4556,"code":1411,"language":75,"meta":76},[73],[78,4558,1411],{"__ignoreMap":76},[57,4560,4340],{"id":4561},"排查步骤-2",[1172,4563,4564,4570,4573],{},[19,4565,4566,4567,4569],{},"将原始响应\u002F文本粘贴到 ",[43,4568,46],{"href":1071}," 中。",[19,4571,4572],{},"让工具自动格式化并高亮错误位置。",[19,4574,4575],{},"根据提示修复：去掉多余逗号、改为双引号、删除注释。",[57,4577,4380],{"id":4578},"解决方式-2",[16,4580,4581,4584],{},[19,4582,4583],{},"对“从文档\u002F日志复制来的 JSON”，永远先过一次校验工具。",[19,4585,4586],{},"后端日志中如果需要“带注释的配置”，使用 JSONC 或 YAML，并明确标注“非标准 JSON”。",[49,4588],{},[52,4590,4592],{"id":4591},"场景-4后端返回了双重序列化的-json-字符串","场景 4：后端返回了“双重序列化”的 JSON 字符串",[57,4594,4302],{"id":4595},"现象-3",[16,4597,4598,4606,4615],{},[19,4599,4600,4601],{},"接口返回的 Body 是一个字符串，内容是 JSON 的文本表示，例如：\n",[70,4602,4604],{"className":4603,"code":1458,"language":75,"meta":76},[73],[78,4605,1458],{"__ignoreMap":76},[19,4607,4608,4609,4611,4612,4614],{},"前端直接 ",[78,4610,552],{}," 一次后，得到的是字符串，而不是对象；再对这个字符串 ",[78,4613,552],{}," 才会得到对象。",[19,4616,4617],{},"如果代码逻辑假设“一次 parse 就是对象”，就会出错。",[57,4619,4325],{"id":4620},"原因-2",[16,4622,4623,4628],{},[19,4624,4625,4626,3422],{},"后端对已经是 JSON 字符串的数据又做了一次 ",[78,4627,1483],{},[19,4629,4630],{},"或者在日志\u002F消息队列中存储时多包了一层。",[57,4632,4340],{"id":4633},"排查步骤-3",[1172,4635,4636,4652],{},[19,4637,4638,4639],{},"在 Network 面板查看原始响应：\n",[16,4640,4641,4647],{},[19,4642,4643,4644,4646],{},"是否以 ",[78,4645,1503],{}," 开头和结尾？",[19,4648,4649,4650,4109],{},"内部是否有大量 ",[78,4651,1509],{},[19,4653,4654,4655,4660],{},"在控制台执行：\n",[70,4656,4658],{"className":4657,"code":1517,"language":565,"meta":76},[563],[78,4659,1517],{"__ignoreMap":76},[16,4661,4662],{},[19,4663,4664,4665,4667],{},"如果 ",[78,4666,1527],{},"，说明是双重序列化。",[57,4669,4380],{"id":4670},"解决方式-3",[16,4672,4673,4678],{},[19,4674,4675,4676,3422],{},"后端避免对已经是 JSON 字符串的数据再次 ",[78,4677,1483],{},[19,4679,4680,4681,4683,4684,4689],{},"前端如果必须兼容这种接口，先解析外层，再显式验证结果是字符串后才二次解析。不要对所有响应都盲目调用两次 ",[78,4682,552],{},"——应从源头修复接口约定：\n",[70,4685,4687],{"className":4686,"code":1548,"language":640,"meta":76},[638],[78,4688,1548],{"__ignoreMap":76},"\n仅在接口约定明确文档化了双重编码时使用此方法。否则应将其视为后端契约 bug。",[49,4691],{},[52,4693,4695],{"id":4694},"场景-5大-json-导致超时-内存问题","场景 5：大 JSON 导致超时 \u002F 内存问题",[12,4697,4698],{},"大 JSON 通常是合法的。失败往往是性能、内存或传输问题，而不是 JSON 语法错误。",[57,4700,4302],{"id":4701},"现象-4",[16,4703,4704,4707],{},[19,4705,4706],{},"接口返回非常大的 JSON（几 MB 甚至几十 MB）。",[19,4708,4709,4710,4712,4713],{},"前端执行 ",[78,4711,552],{}," 时：\n",[16,4714,4715,4718],{},[19,4716,4717],{},"页面卡顿甚至崩溃；",[19,4719,4720,4721,607,4723,4725],{},"或在某些环境中报 ",[78,4722,1584],{},[78,4724,1587],{}," 等错误。",[57,4727,4325],{"id":4728},"原因-3",[16,4730,4731,4734],{},[19,4732,4733],{},"一次性解析超大 JSON 对主线程和内存压力很大。",[19,4735,4736,4737,4739],{},"某些环境（如旧浏览器、低配设备）对单次 ",[78,4738,552],{}," 的大小有限制。",[57,4741,4340],{"id":4742},"排查步骤-4",[1172,4744,4745,4752],{},[19,4746,4747,4748,607,4750,4446],{},"查看响应大小（Network 面板中的 ",[78,4749,1613],{},[78,4751,1616],{},[19,4753,4754],{},"尝试在本地用工具打开该 JSON 文件，看是否同样卡顿。",[57,4756,4380],{"id":4757},"解决方式-4",[16,4759,4760,4771],{},[19,4761,4762,4763],{},"后端：\n",[16,4764,4765,4768],{},[19,4766,4767],{},"对大列表使用分页或游标分页；",[19,4769,4770],{},"只返回必要字段，减少冗余。",[19,4772,4773,4774],{},"前端：\n",[16,4775,4776,4779],{},[19,4777,4778],{},"对大 JSON 做懒加载\u002F虚拟列表；",[19,4780,4781],{},"如可能，使用流式解析（Node.js 中可用 stream + JSON stream 解析库）。",[49,4783],{},[52,4785,4787],{"id":4786},"场景-6编码问题非-utf-8bom-头等","场景 6：编码问题（非 UTF-8、BOM 头等）",[57,4789,4302],{"id":4790},"现象-5",[16,4792,4793,4796],{},[19,4794,4795],{},"接口返回的文本在某些环境下解析失败，报错信息含糊。",[19,4797,4798,4799,4801],{},"在文本编辑器中打开，发现文件带有 BOM 头（",[78,4800,1666],{},"）或编码不是 UTF-8。",[57,4803,4325],{"id":4804},"原因-4",[16,4806,4807,4810],{},[19,4808,4809],{},"某些后端\u002F代理在输出时使用了带 BOM 的 UTF-8 或其他编码。",[19,4811,4812],{},"在系统间交换的 JSON 必须使用 UTF-8 编码。生产端不得添加字节序标记（BOM）；解析端可以选择忽略 BOM，但不能依赖所有解析器都容忍它。",[57,4814,4340],{"id":4815},"排查步骤-5",[1172,4817,4818,4821],{},[19,4819,4820],{},"将响应保存为文件，用支持编码查看的编辑器打开（如 VS Code、Notepad++）。",[19,4822,4823],{},"检查是否有 BOM 头，或编码是否为 UTF-8。",[57,4825,4380],{"id":4826},"解决方式-5",[16,4828,4829,4832,4835],{},[19,4830,4831],{},"后端统一使用无 BOM 的 UTF-8 输出 JSON。",[19,4833,4834],{},"在网关\u002F代理层确保不额外添加 BOM 或改变编码。",[19,4836,4837,4838,4840],{},"在浏览器 Fetch 场景中，解码链会处理部分 BOM 情况，但真正问题可能是：服务器输出了非 UTF-8、文件内容以 ",[78,4839,1706],{}," 进入 JavaScript 字符串、代理\u002F转码层破坏了字节、JSON 字符串内有未转义控制字符、或文本被错误解码。不要把所有\"模糊 parse error\"都归因于 BOM。",[49,4842],{},[52,4844,4846],{"id":4845},"场景-7截断的-json网络中断超时","场景 7：截断的 JSON（网络中断\u002F超时）",[57,4848,4302],{"id":4849},"现象-6",[16,4851,4852,4855],{},[19,4853,4854],{},"接口在传输过程中被中断，响应不完整。",[19,4856,4857,4858],{},"报错类似：\n",[37,4859,4860],{},[12,4861,4862],{},[78,4863,1731],{},[57,4865,4325],{"id":4866},"原因-5",[16,4868,4869],{},[19,4870,4871],{},"网络不稳定、超时、代理中断等导致 JSON 被截断。",[57,4873,4340],{"id":4874},"排查步骤-6",[1172,4876,4877,4892],{},[19,4878,4879,4880],{},"查看 Network 面板中该请求的状态：\n",[16,4881,4882],{},[19,4883,4884,4885,3419,4887,3419,4889,4891],{},"是否显示 ",[78,4886,1755],{},[78,4888,1758],{},[78,4890,1761],{}," 等？",[19,4893,4894,4895,4331,4897,4446],{},"查看响应内容是否明显截断（例如最后一个字符不是 ",[78,4896,1768],{},[78,4898,1771],{},[57,4900,4380],{"id":4901},"解决方式-6",[16,4903,4904,4907],{},[19,4905,4906],{},"前端增加重试逻辑（尤其是移动端\u002F不稳定网络）。",[19,4908,4909],{},"后端\u002F运维侧优化超时设置和重试策略。",[49,4911],{},[52,4913,4915],{"id":4914},"场景-8混入额外文本前后缀垃圾数据","场景 8：混入额外文本（前后缀垃圾数据）",[57,4917,4302],{"id":4918},"现象-7",[16,4920,4921,4935],{},[19,4922,4923,4924,4929,4930],{},"响应前后被加上了额外文本，例如：\n",[70,4925,4927],{"className":4926,"code":1800,"language":812,"meta":76},[810],[78,4928,1800],{"__ignoreMap":76},"\n或\n",[70,4931,4933],{"className":4932,"code":1807,"language":812,"meta":76},[810],[78,4934,1807],{"__ignoreMap":76},[19,4936,4937,4938,4940],{},"直接 ",[78,4939,552],{}," 整个字符串会失败。",[57,4942,4325],{"id":4943},"原因-6",[16,4945,4946,4949],{},[19,4947,4948],{},"某些旧系统\u002F调试逻辑在响应前后拼接了额外信息。",[19,4950,4951],{},"日志\u002F代理层添加了前缀\u002F后缀。",[57,4953,4340],{"id":4954},"排查步骤-7",[1172,4956,4957,4960],{},[19,4958,4959],{},"在 Network 面板查看完整响应文本。",[19,4961,4962],{},"确认是否前后有多余字符。",[57,4964,4380],{"id":4965},"解决方式-7",[16,4967,4968,4971,4986],{},[19,4969,4970],{},"尽量从源头修复，保证响应是”纯 JSON”。",[19,4972,4973,4976,4977,4979,4980,4331,4983,4985],{},[32,4974,4975],{},"不要在生产环境中用正则从混合响应中提取任意 JSON。"," JSON 是嵌套结构，字符串中可以包含花括号，简单的正则表达式无法可靠识别目标 JSON 值。问题包括：顶层可能是数组 ",[78,4978,1854],{},"、字符串字段内可能有 ",[78,4981,4982],{},"{",[78,4984,1768],{},"、文本中可能有多个 JSON 片段、贪婪匹配可能吞掉不属于 JSON 的内容、以及掩盖协议层应修复的问题。",[19,4987,4988,4989],{},"可靠的替代方案：\n",[1172,4990,4991,4994,4997,5000,5006],{},[19,4992,4993],{},"修复 API，使响应 body 始终为纯 JSON。",[19,4995,4996],{},"为不同内容类型设计不同的 endpoint。",[19,4998,4999],{},"如果协议采用已知的包装格式（SSE、NDJSON、JSONP 或特定日志格式），使用对应的 parser。",[19,5001,5002,5003,5005],{},"临时排查时，将原始内容复制到 ",[43,5004,46],{"href":1071}," 中，人工找出 JSON 边界。",[19,5007,5008],{},"在代码中记录有限的、脱敏的响应片段，不要盲目猜测 JSON 边界。",[49,5010],{},[52,5012,5014],{"id":5013},"场景-9后端返回了半-json-半文本的混合内容","场景 9：后端返回了“半 JSON 半文本”的混合内容",[57,5016,4302],{"id":5017},"现象-8",[16,5019,5020,5023,5031],{},[19,5021,5022],{},"响应前半部分是 JSON，后半部分是纯文本或 HTML。",[19,5024,5025,5026],{},"例如：\n",[70,5027,5029],{"className":5028,"code":1896,"language":812,"meta":76},[810],[78,5030,1896],{"__ignoreMap":76},[19,5032,5033,5035],{},[78,5034,552],{}," 只能处理纯 JSON，遇到后面部分就报错。",[57,5037,4325],{"id":5038},"原因-7",[16,5040,5041,5044],{},[19,5042,5043],{},"错误处理逻辑在输出 JSON 后又输出了 HTML\u002F脚本。",[19,5045,5046],{},"某些框架在异常时会追加调试信息。",[57,5048,4340],{"id":5049},"排查步骤-8",[1172,5051,5052,5055],{},[19,5053,5054],{},"查看完整响应文本，确认是否在 JSON 之后还有内容。",[19,5056,5057],{},"检查后端日志，看是否有异常堆栈被输出到响应中。",[57,5059,4380],{"id":5060},"解决方式-8",[16,5062,5063,5066],{},[19,5064,5065],{},"后端确保每个响应要么是纯 JSON，要么是纯 HTML，不要混用。",[19,5067,5068,5069,5071],{},"对错误响应，统一使用 JSON 结构（如 ",[78,5070,112],{}," 字段），不再追加 HTML。",[49,5073],{},[52,5075,5077,5078],{"id":5076},"场景-10用户输入或第三方数据未校验就-jsonparse","场景 10：用户输入或第三方数据未校验就 ",[78,5079,552],{},[57,5081,4302],{"id":5082},"现象-9",[16,5084,5085,5090],{},[19,5086,5087,5088,3422],{},"前端\u002F后端直接对用户输入、第三方 Webhook、消息队列中的数据调用 ",[78,5089,552],{},[19,5091,5092],{},"一旦数据不合法，就导致异常，甚至影响整个请求处理流程。",[57,5094,4325],{"id":5095},"原因-8",[16,5097,5098,5101],{},[19,5099,5100],{},"缺少前置校验：长度、字符集、结构等。",[19,5102,5103],{},"假设“对方一定会发合法 JSON”。",[57,5105,4340],{"id":5106},"排查步骤-9",[1172,5108,5109,5126],{},[19,5110,5111,5112,5114,5115],{},"检查代码中所有 ",[78,5113,552],{}," 调用点：\n",[16,5116,5117,5120],{},[19,5118,5119],{},"数据来源是否可信？",[19,5121,5122,5123,5125],{},"是否有 ",[78,5124,556],{}," 包裹？",[19,5127,5128,5129,5131],{},"对报错的输入样本，粘贴到 ",[43,5130,46],{"href":1071}," 中查看具体错误。",[57,5133,4380],{"id":5134},"解决方式-9",[16,5136,5137,5164],{},[19,5138,5139,5140],{},"对所有外部输入：\n",[16,5141,5142,5145,5148,5151,5158,5161],{},[19,5143,5144],{},"在解析前设置合理的字节大小限制（例如最大 1MB）。",[19,5146,5147],{},"以 UTF-8 解码输入。",[19,5149,5150],{},"在平台暴露解码错误时，拒绝编码格式不正确的输入。",[19,5152,5153,5154,3784,5156,3422],{},"用 ",[78,5155,556],{},[78,5157,552],{},[19,5159,5160],{},"用 schema 或业务规则校验解析后的值。",[19,5162,5163],{},"避免记录完整的不可信 payload，特别是可能包含敏感信息的内容。",[19,5165,5166,5167,4331,5169,3422],{},"JSON 允许 Unicode 字符串——不要限制为\"可打印 ASCII\"，否则会拒绝合法的国际化数据，如 ",[78,5168,2035],{},[78,5170,2038],{},[12,5172,5173,5174,3422],{},"文本能解析后，语法校验只是第一步。在应用中接受数据之前，用 ",[43,5175,5176],{"href":2044},"JSON Schema 校验来检查必填字段、数据类型和允许值",[49,5178],{},[52,5180,5182],{"id":5181},"排查步骤清单可收藏","排查步骤清单（可收藏）",[12,5184,5185],{},"遇到“JSON 解析失败”时，可以按以下顺序快速排查：",[1172,5187,5188,5193,5201,5214,5220,5233,5239,5245],{},[19,5189,5190,4351],{},[32,5191,5192],{},"看状态码",[19,5194,5195,5198,5199,4109],{},[32,5196,5197],{},"看 Content-Type","：是否为 ",[78,5200,1199],{},[19,5202,5203,3553,5206],{},[32,5204,5205],{},"看响应内容",[16,5207,5208,5211],{},[19,5209,5210],{},"是纯 JSON，还是 HTML\u002F文本？",[19,5212,5213],{},"是否前后有多余字符？",[19,5215,5216,5219],{},[32,5217,5218],{},"看大小","：是否异常大（几 MB 以上）？",[19,5221,5222,3553,5225],{},[32,5223,5224],{},"用工具校验",[16,5226,5227],{},[19,5228,5229,5230,5232],{},"将响应粘贴到 ",[43,5231,46],{"href":1071}," 中，自动检查语法错误。",[19,5234,5235,5238],{},[32,5236,5237],{},"看编码","：是否有 BOM 头或非 UTF-8 编码？",[19,5240,5241,5244],{},[32,5242,5243],{},"看日志","：后端是否有异常堆栈输出到响应中？",[19,5246,5247,3553,5250],{},[32,5248,5249],{},"看代码",[16,5251,5252,5259],{},[19,5253,5254,5256,5257,4109],{},[78,5255,552],{}," 是否有 ",[78,5258,556],{},[19,5260,5261],{},"是否对非 2xx 响应也尝试解析？",[49,5263],{},[52,5265,5267],{"id":5266},"如何预防-json-解析失败","如何预防 JSON 解析失败？",[1172,5269,5270,5288,5319,5342],{},[19,5271,5272,5275],{},[32,5273,5274],{},"统一接口规范",[16,5276,5277,5281,5285],{},[19,5278,3332,5279],{},[78,5280,2154],{},[19,5282,3342,5283],{},[78,5284,2160],{},[19,5286,5287],{},"所有响应均为纯 JSON，无额外文本。",[19,5289,5290,5293],{},[32,5291,5292],{},"前端统一解析逻辑",[16,5294,5295,5316],{},[19,5296,5297,5298,5300,5301],{},"封装一个 ",[78,5299,2176],{}," 工具函数：\n",[16,5302,5303,5306,5311],{},[19,5304,5305],{},"检查状态码",[19,5307,5308,5309],{},"检查 ",[78,5310,898],{},[19,5312,5313,5314],{},"再 ",[78,5315,552],{},[19,5317,5318],{},"所有接口调用都通过这个函数，减少重复错误。",[19,5320,5321,5324],{},[32,5322,5323],{},"日志与监控",[16,5325,5326,5339],{},[19,5327,5328,5329],{},"对解析失败的请求，记录：\n",[16,5330,5331,5334,5336],{},[19,5332,5333],{},"状态码",[19,5335,898],{},[19,5337,5338],{},"响应前 1KB（脱敏后）",[19,5340,5341],{},"便于后续定位是后端问题还是网络问题。",[19,5343,5344,5347],{},[32,5345,5346],{},"善用工具",[16,5348,5349,5362],{},[19,5350,5351,5352],{},"开发阶段：\n",[16,5353,5354,5359],{},[19,5355,5153,5356,5358],{},[43,5357,46],{"href":1071}," 快速校验接口返回的 JSON。",[19,5360,5361],{},"对复杂结构，先格式化再阅读。",[19,5363,5364,5365],{},"生产问题排查：\n",[16,5366,5367],{},[19,5368,5369],{},"将问题样本粘贴到编辑器中，快速定位错误位置。",[49,5371],{},[52,5373,4150],{"id":4150},[16,5375,5376,5379,5382],{},[19,5377,5378],{},"“JSON 解析失败”背后可能有多种原因：HTML 错误页、格式错误、编码问题、截断、双重序列化等。",[19,5380,5381],{},"通过系统的排查步骤（状态码 → Content-Type → 响应内容 → 工具校验），可以大幅缩短调试时间。",[19,5383,5384],{},"从长远看，统一接口规范、封装解析逻辑、善用校验工具，是减少这类问题的关键。",[37,5386,5387],{},[12,5388,5389,5390,5392],{},"下次遇到 JSON 解析报错时，可以先将响应粘贴到 ",[43,5391,46],{"href":1071}," 中，快速确认是否是语法问题，再决定是前端处理还是找后端排查。",[52,5394,5395],{"id":5395},"下一步",[16,5397,5398,5404,5410],{},[19,5399,5400,5401,3422],{},"文本能解析后，语法校验只是第一层。了解如何使用 ",[43,5402,5403],{"href":2044},"JSON Schema 校验来检查数据结构、必填字段和数据类型",[19,5405,5406,5407,3422],{},"如果需要 JSON 结构和语法规则的基础 overview，请参阅 ",[43,5408,5409],{"href":2289},"JSON 是什么？",[19,5411,5412,5413,3422],{},"关于接口设计模式和响应结构的最佳实践，请参阅 ",[43,5414,5415],{"href":2296},"JSON 最佳实践",{"title":76,"searchDepth":978,"depth":978,"links":5417},[5418,5419,5425,5432,5438,5444,5450,5456,5462,5468,5474,5481,5482,5483,5484],{"id":4254,"depth":978,"text":4254},{"id":4298,"depth":978,"text":4299,"children":5420},[5421,5422,5423,5424],{"id":4302,"depth":983,"text":4302},{"id":4325,"depth":983,"text":4325},{"id":4340,"depth":983,"text":4340},{"id":4380,"depth":983,"text":4380},{"id":4412,"depth":978,"text":5426,"children":5427},"场景 2：Content-Type 不是 application\u002Fjson",[5428,5429,5430,5431],{"id":4418,"depth":983,"text":4302},{"id":4438,"depth":983,"text":4325},{"id":4457,"depth":983,"text":4340},{"id":4475,"depth":983,"text":4380},{"id":4497,"depth":978,"text":4498,"children":5433},[5434,5435,5436,5437],{"id":4501,"depth":983,"text":4302},{"id":4526,"depth":983,"text":4526},{"id":4561,"depth":983,"text":4340},{"id":4578,"depth":983,"text":4380},{"id":4591,"depth":978,"text":4592,"children":5439},[5440,5441,5442,5443],{"id":4595,"depth":983,"text":4302},{"id":4620,"depth":983,"text":4325},{"id":4633,"depth":983,"text":4340},{"id":4670,"depth":983,"text":4380},{"id":4694,"depth":978,"text":4695,"children":5445},[5446,5447,5448,5449],{"id":4701,"depth":983,"text":4302},{"id":4728,"depth":983,"text":4325},{"id":4742,"depth":983,"text":4340},{"id":4757,"depth":983,"text":4380},{"id":4786,"depth":978,"text":4787,"children":5451},[5452,5453,5454,5455],{"id":4790,"depth":983,"text":4302},{"id":4804,"depth":983,"text":4325},{"id":4815,"depth":983,"text":4340},{"id":4826,"depth":983,"text":4380},{"id":4845,"depth":978,"text":4846,"children":5457},[5458,5459,5460,5461],{"id":4849,"depth":983,"text":4302},{"id":4866,"depth":983,"text":4325},{"id":4874,"depth":983,"text":4340},{"id":4901,"depth":983,"text":4380},{"id":4914,"depth":978,"text":4915,"children":5463},[5464,5465,5466,5467],{"id":4918,"depth":983,"text":4302},{"id":4943,"depth":983,"text":4325},{"id":4954,"depth":983,"text":4340},{"id":4965,"depth":983,"text":4380},{"id":5013,"depth":978,"text":5014,"children":5469},[5470,5471,5472,5473],{"id":5017,"depth":983,"text":4302},{"id":5038,"depth":983,"text":4325},{"id":5049,"depth":983,"text":4340},{"id":5060,"depth":983,"text":4380},{"id":5076,"depth":978,"text":5475,"children":5476},"场景 10：用户输入或第三方数据未校验就 JSON.parse",[5477,5478,5479,5480],{"id":5082,"depth":983,"text":4302},{"id":5095,"depth":983,"text":4325},{"id":5106,"depth":983,"text":4340},{"id":5134,"depth":983,"text":4380},{"id":5181,"depth":978,"text":5182},{"id":5266,"depth":978,"text":5267},{"id":4150,"depth":978,"text":4150},{"id":5395,"depth":978,"text":5395},"从真实接口调试场景出发，总结 JSON.parse 报错的 10 类典型错误，并给出逐步排查方法与预防建议。","\u002Fblog\u002Fcover\u002Fzh\u002Fjson-parse-error-debug-cover.svg",[1029,1028],{},"\u002Fzh\u002Fblog\u002Fjson-parse-error-debug",{"slug":1033,"text":5491,"btn":4221},"🚀 先检查你的 JSON 是否合法：",{"title":4228,"description":5485},"zh\u002Fblog\u002Fjson-parse-error-debug",[1039,46,2379,2380,2381,552],"CFBkuhUr3kITWb-_dlpbNPLXa2aPef5JkWhpt0IGWXQ",{"id":5497,"title":5498,"author":1047,"body":5499,"category":1020,"date":3268,"description":6332,"draft":1023,"extension":1024,"h1":1025,"image":6333,"lastmod":3268,"locales":6334,"meta":6335,"navigation":856,"path":6336,"promo":6337,"seo":6340,"stem":6341,"tags":6342,"__hash__":6344},"blog\u002Fzh\u002Fblog\u002Fwhat-is-json.md","JSON 是什么？结构、语法与常见错误（2026 开发者实战指南）",{"type":9,"value":5500,"toc":6300},[5501,5516,5520,5523,5554,5557,5561,5564,5613,5624,5628,5632,5637,5640,5660,5664,5669,5672,5676,5681,5690,5694,5697,5715,5720,5723,5735,5741,5744,5764,5769,5773,5778,5782,5785,5788,5791,5796,5799,5805,5808,5813,5819,5822,5824,5829,5832,5837,5840,5846,5848,5853,5858,5863,5866,5868,5874,5876,5882,5884,5890,5893,5898,5906,5913,5915,5920,5922,5928,5930,5935,5942,5945,5947,5952,5954,5959,5961,5967,5969,5974,5979,5987,5991,5994,6004,6006,6012,6021,6024,6042,6045,6058,6062,6066,6069,6080,6083,6092,6095,6101,6104,6107,6110,6116,6119,6133,6137,6140,6209,6215,6219,6276,6284,6286],[12,5502,5503,5504,3419,5506,5508,5509,5511,5512,5515],{},"JSON（JavaScript Object Notation）是一种轻量级的数据交换格式，几乎出现在所有现代 Web 开发和 API 设计中：从浏览器与后端通信，到配置文件（如 ",[78,5505,2393],{},[78,5507,2396],{},"），再到日志和消息队列。",[1057,5510],{},"\n与“教科书式介绍”不同，这篇文章会从",[32,5513,5514],{},"真实开发场景","出发，解释 JSON 的结构与语法，并重点剖析你在日常开发中最容易遇到的错误及其排查方法。",[52,5517,5519],{"id":5518},"为什么开发者必须懂-json","为什么开发者必须懂 JSON？",[12,5521,5522],{},"在现代 Web 开发中，JSON 几乎无处不在：",[16,5524,5525,5531,5543,5548],{},[19,5526,5527,5530],{},[32,5528,5529],{},"前后端通信","：RESTful API 和大多数 GraphQL 服务使用 JSON 作为请求\u002F响应体。",[19,5532,5533,5536,5537,5539,5540,5542],{},[32,5534,5535],{},"配置文件","：Node.js 项目中的 ",[78,5538,2393],{},"、TypeScript 的 ",[78,5541,2396],{}," 等都是 JSON 或 JSON 的超集。",[19,5544,5545,5547],{},[32,5546,5323],{},"：许多日志系统（如 ELK、Cloudflare Logs）使用 JSON 格式存储结构化日志。",[19,5549,5550,5553],{},[32,5551,5552],{},"第三方服务集成","：支付、短信、邮件、分析平台等 SDK 通常返回或接收 JSON。",[12,5555,5556],{},"不理解 JSON 的严格语法规则，很容易在调试接口、解析响应、处理配置时浪费大量时间。",[52,5558,5560],{"id":5559},"json-的数据类型不只是对象和数组","JSON 的数据类型：不只是“对象和数组”",[12,5562,5563],{},"JSON 只支持有限的几种数据类型，这也是它简单且易解析的原因：",[16,5565,5566,5575,5583,5591,5597,5607],{},[19,5567,5568,5571,5572,5574],{},[32,5569,5570],{},"对象（Object）","：键值对集合，用 ",[78,5573,2463],{}," 包裹。",[19,5576,5577,5580,5581,5574],{},[32,5578,5579],{},"数组（Array）","：有序列表，用 ",[78,5582,1854],{},[19,5584,5585,5588,5589,5574],{},[32,5586,5587],{},"字符串（String）","：必须用双引号 ",[78,5590,1503],{},[19,5592,5593,5596],{},[32,5594,5595],{},"数字（Number）","：整数或浮点数，不支持十六进制、八进制。",[19,5598,5599,5602,5603,4331,5605,3422],{},[32,5600,5601],{},"布尔值（Boolean）","：",[78,5604,2493],{},[78,5606,2496],{},[19,5608,5609,5612],{},[32,5610,5611],{},"空值（null）","：表示“无值”。",[12,5614,5615,5616,5618,5619,5621,5622,3422],{},"JSON 不支持：函数、日期对象、正则、",[78,5617,2512],{},"、注释等。",[1057,5620],{},"\n在真实项目中，日期通常用 ISO 8601 字符串表示，如 ",[78,5623,2519],{},[52,5625,5627],{"id":5626},"真实接口中的-json-长什么样","真实接口中的 JSON 长什么样？",[57,5629,5631],{"id":5630},"典型-rest-api-响应","典型 REST API 响应",[70,5633,5635],{"className":5634,"code":2531,"language":75,"meta":76},[73],[78,5636,2531],{"__ignoreMap":76},[12,5638,5639],{},"特点：",[16,5641,5642,5652,5655],{},[19,5643,5644,5645,3419,5647,3419,5649,5651],{},"顶层是对象，便于扩展（",[78,5646,101],{},[78,5648,108],{},[78,5650,121],{}," 等字段）。",[19,5653,5654],{},"使用嵌套对象和数组表达复杂结构。",[19,5656,5657,5658,3422],{},"日期用字符串表示，而不是 ",[78,5659,2557],{},[57,5661,5663],{"id":5662},"列表接口分页","列表接口（分页）",[70,5665,5667],{"className":5666,"code":2565,"language":75,"meta":76},[73],[78,5668,2565],{"__ignoreMap":76},[12,5670,5671],{},"这种结构在后台管理系统、内容列表中非常常见。",[57,5673,5675],{"id":5674},"错误响应容易被忽略","错误响应（容易被忽略）",[70,5677,5679],{"className":5678,"code":2578,"language":75,"meta":76},[73],[78,5680,2578],{"__ignoreMap":76},[12,5682,5683,5684,5686,5687,5689],{},"当后端校验 JSON 失败时，往往返回类似结构。前端如果直接 ",[78,5685,552],{}," 原始响应，而没检查 ",[78,5688,101],{}," 字段，就容易在错误处理上踩坑。",[52,5691,5693],{"id":5692},"json-的语法规则从能跑到严格正确","JSON 的语法规则：从“能跑”到“严格正确”",[57,5695,5570],{"id":5696},"对象object",[16,5698,5699,5703,5709],{},[19,5700,5153,5701,5574],{},[78,5702,2463],{},[19,5704,5705,5706,5708],{},"内部是零个或多个 ",[78,5707,2609],{}," 对，用逗号分隔。",[19,5710,5711,5712,3422],{},"键必须是",[32,5713,5714],{},"双引号字符串",[70,5716,5718],{"className":5717,"code":2621,"language":75,"meta":76},[73],[78,5719,2621],{"__ignoreMap":76},[57,5721,5579],{"id":5722},"数组array",[16,5724,5725,5729,5732],{},[19,5726,5153,5727,5574],{},[78,5728,1854],{},[19,5730,5731],{},"内部是零个或多个值，用逗号分隔。",[19,5733,5734],{},"值可以是任意合法 JSON 值，类型可混合。",[70,5736,5739],{"className":5737,"code":5738,"language":75,"meta":76},[73],"[\n  \"apple\",\n  42,\n  true,\n  { \"key\": \"value\" },\n]\n",[78,5740,5738],{"__ignoreMap":76},[57,5742,5743],{"id":5743},"字符串与转义",[16,5745,5746,5751],{},[19,5747,5748,5749,3422],{},"必须使用双引号 ",[78,5750,1503],{},[19,5752,5753,5754,3419,5756,3419,5758,3419,5760,3419,5762,3422],{},"常见转义：",[78,5755,1509],{},[78,5757,2663],{},[78,5759,2666],{},[78,5761,2669],{},[78,5763,2672],{},[70,5765,5767],{"className":5766,"code":2676,"language":75,"meta":76},[73],[78,5768,2676],{"__ignoreMap":76},[57,5770,5772],{"id":5771},"数字布尔null","数字、布尔、null",[70,5774,5776],{"className":5775,"code":2686,"language":75,"meta":76},[73],[78,5777,2686],{"__ignoreMap":76},[52,5779,5781],{"id":5780},"常见-json-错误从报错信息到修复步骤","常见 JSON 错误：从报错信息到修复步骤",[12,5783,5784],{},"下面列出真实开发中最常见的 JSON 错误，并配上典型报错信息和排查思路。",[57,5786,5787],{"id":5787},"使用单引号或无引号的键",[12,5789,5790],{},"错误示例：",[70,5792,5794],{"className":5793,"code":2706,"language":75,"meta":76},[73],[78,5795,2706],{"__ignoreMap":76},[12,5797,5798],{},"典型报错（浏览器 \u002F Node.js）：",[37,5800,5801],{},[12,5802,5803],{},[78,5804,2718],{},[12,5806,5807],{},"修复：",[70,5809,5811],{"className":5810,"code":2725,"language":75,"meta":76},[73],[78,5812,2725],{"__ignoreMap":76},[12,5814,5815,5818],{},[32,5816,5817],{},"要点","：JSON 中所有字符串（包括键）都必须用双引号。",[57,5820,5821],{"id":5821},"末尾多余的逗号",[12,5823,5790],{},[70,5825,5827],{"className":5826,"code":1389,"language":75,"meta":76},[73],[78,5828,1389],{"__ignoreMap":76},[12,5830,5831],{},"或：",[70,5833,5835],{"className":5834,"code":2751,"language":75,"meta":76},[73],[78,5836,2751],{"__ignoreMap":76},[12,5838,5839],{},"典型报错：",[37,5841,5842],{},[12,5843,5844],{},[78,5845,2763],{},[12,5847,5807],{},[70,5849,5851],{"className":5850,"code":2769,"language":75,"meta":76},[73],[78,5852,2769],{"__ignoreMap":76},[70,5854,5856],{"className":5855,"code":76,"language":75,"meta":76},[73],[78,5857,76],{"__ignoreMap":76},[12,5859,5860,5862],{},[32,5861,5817],{},"：JSON 不允许在最后一个元素后有多余逗号。",[57,5864,4553],{"id":5865},"在-json-中写注释",[12,5867,5790],{},[70,5869,5872],{"className":5870,"code":5871,"language":75,"meta":76},[73],"{\n  \u002F\u002F 用户信息\n  \"name\": \"Alice\",\n  \"age\": 30\n}\n",[78,5873,5871],{"__ignoreMap":76},[12,5875,5831],{},[70,5877,5880],{"className":5878,"code":5879,"language":75,"meta":76},[73],"{\n  \"name\": \"Alice\", \u002F* 年龄 *\u002F \"age\": 30\n}\n",[78,5881,5879],{"__ignoreMap":76},[12,5883,5839],{},[37,5885,5886],{},[12,5887,5888],{},[78,5889,1101],{},[12,5891,5892],{},"修复：去掉所有注释。",[70,5894,5896],{"className":5895,"code":2769,"language":75,"meta":76},[73],[78,5897,2769],{"__ignoreMap":76},[12,5899,5900,5902,5903,5905],{},[32,5901,5817],{},"：标准 JSON 不支持任何注释。",[1057,5904],{},"\n如果确实需要“带注释的配置”，可以考虑 JSONC 或 YAML，但它们不是标准 JSON。",[57,5907,5909,5910,5912],{"id":5908},"使用非法值undefined函数日期对象等","使用非法值：",[78,5911,2512],{},"、函数、日期对象等",[12,5914,5790],{},[70,5916,5918],{"className":5917,"code":2839,"language":75,"meta":76},[73],[78,5919,2839],{"__ignoreMap":76},[12,5921,5839],{},[37,5923,5924],{},[12,5925,5926],{},[78,5927,1096],{},[12,5929,5807],{},[70,5931,5933],{"className":5932,"code":2855,"language":75,"meta":76},[73],[78,5934,2855],{"__ignoreMap":76},[12,5936,5937,5939,5940,3422],{},[32,5938,5817],{},"：JSON 只支持对象、数组、字符串、数字、布尔和 ",[78,5941,314],{},[57,5943,5944],{"id":5944},"字符串中包含未转义的引号或换行",[12,5946,5790],{},[70,5948,5950],{"className":5949,"code":2874,"language":75,"meta":76},[73],[78,5951,2874],{"__ignoreMap":76},[12,5953,5831],{},[70,5955,5957],{"className":5956,"code":2882,"language":75,"meta":76},[73],[78,5958,2882],{"__ignoreMap":76},[12,5960,5839],{},[37,5962,5963],{},[12,5964,5965],{},[78,5966,2893],{},[12,5968,5807],{},[70,5970,5972],{"className":5971,"code":2899,"language":75,"meta":76},[73],[78,5973,2899],{"__ignoreMap":76},[70,5975,5977],{"className":5976,"code":2905,"language":75,"meta":76},[73],[78,5978,2905],{"__ignoreMap":76},[12,5980,5981,5983,5984,5986],{},[32,5982,5817],{},"：字符串中的双引号必须转义为 ",[78,5985,1509],{},"，换行等控制字符必须用转义序列表示。",[57,5988,5990],{"id":5989},"把html-错误页当成-json-解析","把“HTML 错误页”当成 JSON 解析",[12,5992,5993],{},"真实场景：",[16,5995,5996,5999],{},[19,5997,5998],{},"请求接口时，服务器返回 500\u002F404，Body 是 HTML 错误页，而不是 JSON。",[19,6000,4313,6001,6003],{},[78,6002,1140],{},"，结果报错。",[12,6005,5839],{},[37,6007,6008],{},[12,6009,6010],{},[78,6011,1091],{},[12,6013,6014,6015,6017,6018,6020],{},"原因：HTML 以 ",[78,6016,1165],{}," 开头（如 ",[78,6019,1157],{},"），不是合法 JSON。",[12,6022,6023],{},"排查步骤：",[1172,6025,6026,6031,6039],{},[19,6027,6028,6029,3422],{},"打开浏览器 Network 面板，查看该请求的 ",[32,6030,2960],{},[19,6032,6033,6034,6036,6037,3422],{},"确认返回的 ",[78,6035,898],{}," 是否为 ",[78,6038,1199],{},[19,6040,6041],{},"检查状态码是否为 2xx，以及 Body 是否为真正的 JSON。",[12,6043,6044],{},"解决方式：",[16,6046,6047,6053],{},[19,6048,6049,6050,6052],{},"在前端解析前，先检查 ",[78,6051,898],{}," 和状态码。",[19,6054,6055,6056,3422],{},"对非 2xx 响应，优先读取错误信息，而不是直接 ",[78,6057,552],{},[52,6059,6061],{"id":6060},"如何快速检查-json-是否正确","如何快速检查 JSON 是否正确？",[57,6063,6065],{"id":6064},"使用在线-json-验证与格式化工具","使用在线 JSON 验证与格式化工具",[12,6067,6068],{},"把你的 JSON 粘贴到在线工具中，可以：",[16,6070,6071,6074,6077],{},[19,6072,6073],{},"自动检查语法错误，并提示错误位置（行\u002F列）。",[19,6075,6076],{},"一键格式化（缩进、换行），方便阅读和调试。",[19,6078,6079],{},"支持压缩（minify），减少传输体积。",[12,6081,6082],{},"如果你正在构建工具站，可以在这里自然引导用户使用你的工具，例如：",[37,6084,6085],{},[12,6086,6087,6088,6091],{},"把你的 JSON 粘贴到我们的 ",[43,6089,6090],{"href":1071},"JSON 编辑器"," 中，自动检查语法错误并格式化输出。",[57,6093,6094],{"id":6094},"浏览器控制台快速验证",[70,6096,6099],{"className":6097,"code":6098,"language":565,"meta":76},[563],"const text = `你的 JSON 字符串`;\nJSON.parse(text);\n",[78,6100,6098],{"__ignoreMap":76},[12,6102,6103],{},"如果有语法错误，会抛出异常，并在控制台显示错误信息和大致位置。",[57,6105,6106],{"id":6106},"在代码中安全解析",[12,6108,6109],{},"Node.js \u002F 前端中：",[70,6111,6114],{"className":6112,"code":6113,"language":565,"meta":76},[563],"try {\n  const data = JSON.parse(text);\n  \u002F\u002F 合法 JSON，继续处理\n} catch (e) {\n  \u002F\u002F 不合法 JSON\n  console.error('JSON 解析失败:', e.message);\n}\n",[78,6115,6113],{"__ignoreMap":76},[12,6117,6118],{},"在生产环境中，建议：",[16,6120,6121,6127,6130],{},[19,6122,6123,6124,6126],{},"不要直接 ",[78,6125,552],{}," 用户输入或不可信来源的数据。",[19,6128,6129],{},"先做长度限制、字符白名单校验，再解析。",[19,6131,6132],{},"对解析后的数据结构做 schema 校验（如使用 JSON Schema、Zod、Joi 等）。",[52,6134,6136],{"id":6135},"json-与-javascript-对象字面量的区别","JSON 与 JavaScript 对象字面量的区别",[12,6138,6139],{},"很多人会把 JSON 和 JavaScript 对象字面量混淆，它们并不完全相同：",[16,6141,6142,6160,6178,6196],{},[19,6143,6144,6147],{},[32,6145,6146],{},"键的引号",[16,6148,6149,6155],{},[19,6150,6151,6152,6154],{},"JS：",[78,6153,3084],{}," 合法",[19,6156,6157,6158],{},"JSON：必须写成 ",[78,6159,3091],{},[19,6161,6162,6165],{},[32,6163,6164],{},"值的类型",[16,6166,6167,6173],{},[19,6168,6169,6170,6172],{},"JS：可以是函数、日期、正则、",[78,6171,2512],{}," 等",[19,6174,6175,6176],{},"JSON：只能是对象、数组、字符串、数字、布尔、",[78,6177,314],{},[19,6179,6180,6183],{},[32,6181,6182],{},"注释",[16,6184,6185,6193],{},[19,6186,6187,6188,6190,6191],{},"JS：支持 ",[78,6189,3122],{}," 和 ",[78,6192,3125],{},[19,6194,6195],{},"JSON：不支持任何注释",[19,6197,6198,6201],{},[32,6199,6200],{},"引号风格",[16,6202,6203,6206],{},[19,6204,6205],{},"JS：字符串可以用单引号或双引号",[19,6207,6208],{},"JSON：只能用双引号",[12,6210,6211,6212,6214],{},"因此，不能简单地把 JS 对象当作 JSON 直接发给后端，需要使用 ",[78,6213,3147],{}," 进行序列化。",[52,6216,6218],{"id":6217},"实战建议如何在项目中用好-json","实战建议：如何在项目中用好 JSON？",[1172,6220,6221,6242,6260],{},[19,6222,6223,6225],{},[32,6224,4049],{},[16,6226,6227,6236,6239],{},[19,6228,6229,6230,3166,6232,3166,6234,4446],{},"统一响应结构（如 ",[78,6231,101],{},[78,6233,108],{},[78,6235,112],{},[19,6237,6238],{},"明确日期、时间使用 ISO 8601 字符串。",[19,6240,6241],{},"避免在 JSON 中返回敏感信息（密钥、内部 ID、调试信息）。",[19,6243,6244,6247],{},[32,6245,6246],{},"前端处理",[16,6248,6249,6254,6257],{},[19,6250,6251,6252,6052],{},"解析前检查 ",[78,6253,898],{},[19,6255,6256],{},"对大 JSON 做分页或按需加载，避免一次性解析过大数据。",[19,6258,6259],{},"使用 TypeScript 或 JSON Schema 对接口数据结构做类型约束。",[19,6261,6262,6265],{},[32,6263,6264],{},"调试与排查",[16,6266,6267,6273],{},[19,6268,6269,6270,6272],{},"遇到 ",[78,6271,3207],{}," 时，先用工具格式化 JSON，再根据提示定位错误行。",[19,6274,6275],{},"对“看起来像 JSON 的字符串”保持警惕，尤其是从日志、第三方文档复制过来的内容。",[37,6277,6278],{},[12,6279,6280,6281,6283],{},"如果你经常需要检查和格式化 JSON，可以把我们的 ",[43,6282,6090],{"href":1071}," 加入书签，快速验证任意 JSON 片段。",[52,6285,4150],{"id":4150},[16,6287,6288,6291,6294,6297],{},[19,6289,6290],{},"JSON 是现代 Web 开发中最基础也最重要的数据格式之一，理解其严格语法能显著减少接口调试时间。",[19,6292,6293],{},"常见错误多来自“写得像 JavaScript 对象”，而不是“严格按 JSON 规范”：单引号、多余逗号、注释、非法值等。",[19,6295,6296],{},"在真实项目中，要结合接口设计、前端解析、错误处理一起考虑，而不是只停留在“语法层面”。",[19,6298,6299],{},"配合在线 JSON 工具（格式化、校验、压缩）可以大幅提升开发效率，也能为你的站点带来持续的搜索流量和使用场景。",{"title":76,"searchDepth":978,"depth":978,"links":6301},[6302,6303,6304,6309,6315,6324,6329,6330,6331],{"id":5518,"depth":978,"text":5519},{"id":5559,"depth":978,"text":5560},{"id":5626,"depth":978,"text":5627,"children":6305},[6306,6307,6308],{"id":5630,"depth":983,"text":5631},{"id":5662,"depth":983,"text":5663},{"id":5674,"depth":983,"text":5675},{"id":5692,"depth":978,"text":5693,"children":6310},[6311,6312,6313,6314],{"id":5696,"depth":983,"text":5570},{"id":5722,"depth":983,"text":5579},{"id":5743,"depth":983,"text":5743},{"id":5771,"depth":983,"text":5772},{"id":5780,"depth":978,"text":5781,"children":6316},[6317,6318,6319,6320,6322,6323],{"id":5787,"depth":983,"text":5787},{"id":5821,"depth":983,"text":5821},{"id":5865,"depth":983,"text":4553},{"id":5908,"depth":983,"text":6321},"使用非法值：undefined、函数、日期对象等",{"id":5944,"depth":983,"text":5944},{"id":5989,"depth":983,"text":5990},{"id":6060,"depth":978,"text":6061,"children":6325},[6326,6327,6328],{"id":6064,"depth":983,"text":6065},{"id":6094,"depth":983,"text":6094},{"id":6106,"depth":983,"text":6106},{"id":6135,"depth":978,"text":6136},{"id":6217,"depth":978,"text":6218},{"id":4150,"depth":978,"text":4150},"从真实开发场景讲解 JSON 是什么、数据结构与语法规则，并剖析接口调试中最常见的 JSON 错误与排查方法。","\u002Fblog\u002Fcover\u002Fzh\u002Fwhat-is-json-cover.svg",[1029,1028],{},"\u002Fzh\u002Fblog\u002Fwhat-is-json",{"slug":1033,"text":6338,"btn":6339},"🚀 直接开始格式化你的 JSON：","打开 JSON 编辑器",{"title":5498,"description":6332},"zh\u002Fblog\u002Fwhat-is-json",[1039,6343,2379,2380,3279],"JSON Formatter","WOns0rebdRGUeXKKe7KWWk8jJrNOPmIgJVgMCB8Ygmw",1791273858398]