[{"data":1,"prerenderedAt":802},["ShallowReactive",2],{"post-/blog/json-in-api":3,"related-/blog/json-in-api":209},{"_path":4,"_dir":5,"_draft":6,"_partial":6,"_locale":7,"title":8,"description":9,"date":10,"category":11,"keywords":12,"body":16,"_type":203,"_id":204,"_source":205,"_file":206,"_stem":207,"_extension":208},"/blog/json-in-api","blog",false,"","JSON 在 API 中的应用","RESTful 与 GraphQL API 普遍用 JSON 作为请求响应格式，本文介绍最佳实践。","2026-08-19","场景",[13,14,15],"json api","restful json","api响应",{"type":17,"children":18,"toc":195},"root",[19,27,33,39,44,49,54,59,152,157,179,184,189],{"type":20,"tag":21,"props":22,"children":24},"element","h1",{"id":23},"json-在-api-中的应用",[25],{"type":26,"value":8},"text",{"type":20,"tag":28,"props":29,"children":30},"p",{},[31],{"type":26,"value":32},"JSON 是当今 Web API 事实标准格式，RESTful 与 GraphQL 均广泛采用。",{"type":20,"tag":34,"props":35,"children":37},"h2",{"id":36},"响应设计",[38],{"type":26,"value":36},{"type":20,"tag":28,"props":40,"children":41},{},[42],{"type":26,"value":43},"统一状态码与错误结构、合理分页、字段命名一致、避免过深嵌套。",{"type":20,"tag":34,"props":45,"children":47},{"id":46},"最佳实践",[48],{"type":26,"value":46},{"type":20,"tag":28,"props":50,"children":51},{},[52],{"type":26,"value":53},"用 HTTPS、压缩响应、版本化、文档化字段含义。",{"type":20,"tag":34,"props":55,"children":57},{"id":56},"代码示例",[58],{"type":26,"value":56},{"type":20,"tag":60,"props":61,"children":65},"pre",{"className":62,"code":63,"language":64,"meta":7,"style":7},"language-json shiki shiki-themes github-dark","{\"code\": 0, \"data\": {\"id\": 1}, \"message\": \"ok\"}\n","json",[66],{"type":20,"tag":67,"props":68,"children":69},"code",{"__ignoreMap":7},[70],{"type":20,"tag":71,"props":72,"children":75},"span",{"class":73,"line":74},"line",1,[76,82,88,93,98,103,108,113,118,122,127,132,137,141,147],{"type":20,"tag":71,"props":77,"children":79},{"style":78},"--shiki-default:#E1E4E8",[80],{"type":26,"value":81},"{",{"type":20,"tag":71,"props":83,"children":85},{"style":84},"--shiki-default:#79B8FF",[86],{"type":26,"value":87},"\"code\"",{"type":20,"tag":71,"props":89,"children":90},{"style":78},[91],{"type":26,"value":92},": ",{"type":20,"tag":71,"props":94,"children":95},{"style":84},[96],{"type":26,"value":97},"0",{"type":20,"tag":71,"props":99,"children":100},{"style":78},[101],{"type":26,"value":102},", ",{"type":20,"tag":71,"props":104,"children":105},{"style":84},[106],{"type":26,"value":107},"\"data\"",{"type":20,"tag":71,"props":109,"children":110},{"style":78},[111],{"type":26,"value":112},": {",{"type":20,"tag":71,"props":114,"children":115},{"style":84},[116],{"type":26,"value":117},"\"id\"",{"type":20,"tag":71,"props":119,"children":120},{"style":78},[121],{"type":26,"value":92},{"type":20,"tag":71,"props":123,"children":124},{"style":84},[125],{"type":26,"value":126},"1",{"type":20,"tag":71,"props":128,"children":129},{"style":78},[130],{"type":26,"value":131},"}, ",{"type":20,"tag":71,"props":133,"children":134},{"style":84},[135],{"type":26,"value":136},"\"message\"",{"type":20,"tag":71,"props":138,"children":139},{"style":78},[140],{"type":26,"value":92},{"type":20,"tag":71,"props":142,"children":144},{"style":143},"--shiki-default:#9ECBFF",[145],{"type":26,"value":146},"\"ok\"",{"type":20,"tag":71,"props":148,"children":149},{"style":78},[150],{"type":26,"value":151},"}\n",{"type":20,"tag":34,"props":153,"children":155},{"id":154},"推荐在线工具",[156],{"type":26,"value":154},{"type":20,"tag":158,"props":159,"children":160},"ul",{},[161,171],{"type":20,"tag":162,"props":163,"children":164},"li",{},[165],{"type":20,"tag":166,"props":167,"children":169},"a",{"href":168},"/format",[170],{"type":26,"value":168},{"type":20,"tag":162,"props":172,"children":173},{},[174],{"type":20,"tag":166,"props":175,"children":177},{"href":176},"/validate",[178],{"type":26,"value":176},{"type":20,"tag":34,"props":180,"children":182},{"id":181},"小结",[183],{"type":26,"value":181},{"type":20,"tag":28,"props":185,"children":186},{},[187],{"type":26,"value":188},"RESTful 与 GraphQL API 普遍用 JSON 作为请求响应格式，本文介绍最佳实践。 JSONDog 提供全套 JSON 在线工具，纯前端、零上传、中英双语，欢迎免费使用。",{"type":20,"tag":190,"props":191,"children":192},"style",{},[193],{"type":26,"value":194},"html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}",{"title":7,"searchDepth":196,"depth":196,"links":197},2,[198,199,200,201,202],{"id":36,"depth":196,"text":36},{"id":46,"depth":196,"text":46},{"id":56,"depth":196,"text":56},{"id":154,"depth":196,"text":154},{"id":181,"depth":196,"text":181},"markdown","content:blog:json-in-api.md","content","blog/json-in-api.md","blog/json-in-api","md",[210,361,500,664],{"_path":211,"_dir":5,"_draft":6,"_partial":6,"_locale":7,"title":212,"description":213,"date":10,"category":11,"keywords":214,"body":218,"_type":203,"_id":358,"_source":205,"_file":359,"_stem":360,"_extension":208},"/blog/json-as-config","JSON 作为配置文件","JSON 常用作配置文件，但不支持注释，可考虑 JSON5 或 JSONC 替代。",[215,216,217],"json配置","json config","jsonc",{"type":17,"children":219,"toc":351},[220,225,230,235,240,245,250,254,317,321,338,342,347],{"type":20,"tag":21,"props":221,"children":223},{"id":222},"json-作为配置文件",[224],{"type":26,"value":212},{"type":20,"tag":28,"props":226,"children":227},{},[228],{"type":26,"value":229},"JSON 常用作配置文件（如 tsconfig、package.json），但不支持注释，编辑不便。",{"type":20,"tag":34,"props":231,"children":233},{"id":232},"优缺点",[234],{"type":26,"value":232},{"type":20,"tag":28,"props":236,"children":237},{},[238],{"type":26,"value":239},"优点：标准、解析快、跨语言；缺点：无注释、无多行字符串、尾逗号非法。",{"type":20,"tag":34,"props":241,"children":243},{"id":242},"替代方案",[244],{"type":26,"value":242},{"type":20,"tag":28,"props":246,"children":247},{},[248],{"type":26,"value":249},"JSON5、JSONC（带注释）、YAML、TOML 更适合人工编辑的配置。",{"type":20,"tag":34,"props":251,"children":252},{"id":56},[253],{"type":26,"value":56},{"type":20,"tag":60,"props":255,"children":257},{"className":62,"code":256,"language":64,"meta":7,"style":7},"{\n  \"compilerOptions\": {\n    \"target\": \"es2020\"\n  }\n}\n",[258],{"type":20,"tag":67,"props":259,"children":260},{"__ignoreMap":7},[261,269,282,300,309],{"type":20,"tag":71,"props":262,"children":263},{"class":73,"line":74},[264],{"type":20,"tag":71,"props":265,"children":266},{"style":78},[267],{"type":26,"value":268},"{\n",{"type":20,"tag":71,"props":270,"children":271},{"class":73,"line":196},[272,277],{"type":20,"tag":71,"props":273,"children":274},{"style":84},[275],{"type":26,"value":276},"  \"compilerOptions\"",{"type":20,"tag":71,"props":278,"children":279},{"style":78},[280],{"type":26,"value":281},": {\n",{"type":20,"tag":71,"props":283,"children":285},{"class":73,"line":284},3,[286,291,295],{"type":20,"tag":71,"props":287,"children":288},{"style":84},[289],{"type":26,"value":290},"    \"target\"",{"type":20,"tag":71,"props":292,"children":293},{"style":78},[294],{"type":26,"value":92},{"type":20,"tag":71,"props":296,"children":297},{"style":143},[298],{"type":26,"value":299},"\"es2020\"\n",{"type":20,"tag":71,"props":301,"children":303},{"class":73,"line":302},4,[304],{"type":20,"tag":71,"props":305,"children":306},{"style":78},[307],{"type":26,"value":308},"  }\n",{"type":20,"tag":71,"props":310,"children":312},{"class":73,"line":311},5,[313],{"type":20,"tag":71,"props":314,"children":315},{"style":78},[316],{"type":26,"value":151},{"type":20,"tag":34,"props":318,"children":319},{"id":154},[320],{"type":26,"value":154},{"type":20,"tag":158,"props":322,"children":323},{},[324,331],{"type":20,"tag":162,"props":325,"children":326},{},[327],{"type":20,"tag":166,"props":328,"children":329},{"href":168},[330],{"type":26,"value":168},{"type":20,"tag":162,"props":332,"children":333},{},[334],{"type":20,"tag":166,"props":335,"children":336},{"href":176},[337],{"type":26,"value":176},{"type":20,"tag":34,"props":339,"children":340},{"id":181},[341],{"type":26,"value":181},{"type":20,"tag":28,"props":343,"children":344},{},[345],{"type":26,"value":346},"JSON 常用作配置文件，但不支持注释，可考虑 JSON5 或 JSONC 替代。 JSONDog 提供全套 JSON 在线工具，纯前端、零上传、中英双语，欢迎免费使用。",{"type":20,"tag":190,"props":348,"children":349},{},[350],{"type":26,"value":194},{"title":7,"searchDepth":196,"depth":196,"links":352},[353,354,355,356,357],{"id":232,"depth":196,"text":232},{"id":242,"depth":196,"text":242},{"id":56,"depth":196,"text":56},{"id":154,"depth":196,"text":154},{"id":181,"depth":196,"text":181},"content:blog:json-as-config.md","blog/json-as-config.md","blog/json-as-config",{"_path":362,"_dir":5,"_draft":6,"_partial":6,"_locale":7,"title":363,"description":364,"date":10,"category":11,"keywords":365,"body":369,"_type":203,"_id":497,"_source":205,"_file":498,"_stem":499,"_extension":208},"/blog/json-caching","JSON 缓存策略","JSON 响应可缓存于 CDN、Redis、本地，本文介绍缓存键设计与失效策略。",[366,367,368],"json缓存","api缓存","redis json",{"type":17,"children":370,"toc":490},[371,376,381,386,391,396,401,405,455,459,477,481,486],{"type":20,"tag":21,"props":372,"children":374},{"id":373},"json-缓存策略",[375],{"type":26,"value":363},{"type":20,"tag":28,"props":377,"children":378},{},[379],{"type":26,"value":380},"JSON 响应缓存可大幅提升性能，需合理设计缓存键与失效策略。",{"type":20,"tag":34,"props":382,"children":384},{"id":383},"缓存层",[385],{"type":26,"value":383},{"type":20,"tag":28,"props":387,"children":388},{},[389],{"type":26,"value":390},"CDN 缓存静态 JSON、Redis 缓存热点接口、浏览器缓存带 ETag。",{"type":20,"tag":34,"props":392,"children":394},{"id":393},"失效策略",[395],{"type":26,"value":393},{"type":20,"tag":28,"props":397,"children":398},{},[399],{"type":26,"value":400},"TTL 过期、版本号键、主动清除，注意一致性。",{"type":20,"tag":34,"props":402,"children":403},{"id":56},[404],{"type":26,"value":56},{"type":20,"tag":60,"props":406,"children":408},{"className":62,"code":407,"language":64,"meta":7,"style":7},"{\"key\": \"user:1:profile\", \"ttl\": 3600}\n",[409],{"type":20,"tag":67,"props":410,"children":411},{"__ignoreMap":7},[412],{"type":20,"tag":71,"props":413,"children":414},{"class":73,"line":74},[415,419,424,428,433,437,442,446,451],{"type":20,"tag":71,"props":416,"children":417},{"style":78},[418],{"type":26,"value":81},{"type":20,"tag":71,"props":420,"children":421},{"style":84},[422],{"type":26,"value":423},"\"key\"",{"type":20,"tag":71,"props":425,"children":426},{"style":78},[427],{"type":26,"value":92},{"type":20,"tag":71,"props":429,"children":430},{"style":143},[431],{"type":26,"value":432},"\"user:1:profile\"",{"type":20,"tag":71,"props":434,"children":435},{"style":78},[436],{"type":26,"value":102},{"type":20,"tag":71,"props":438,"children":439},{"style":84},[440],{"type":26,"value":441},"\"ttl\"",{"type":20,"tag":71,"props":443,"children":444},{"style":78},[445],{"type":26,"value":92},{"type":20,"tag":71,"props":447,"children":448},{"style":84},[449],{"type":26,"value":450},"3600",{"type":20,"tag":71,"props":452,"children":453},{"style":78},[454],{"type":26,"value":151},{"type":20,"tag":34,"props":456,"children":457},{"id":154},[458],{"type":26,"value":154},{"type":20,"tag":158,"props":460,"children":461},{},[462,470],{"type":20,"tag":162,"props":463,"children":464},{},[465],{"type":20,"tag":166,"props":466,"children":468},{"href":467},"/minify",[469],{"type":26,"value":467},{"type":20,"tag":162,"props":471,"children":472},{},[473],{"type":20,"tag":166,"props":474,"children":475},{"href":168},[476],{"type":26,"value":168},{"type":20,"tag":34,"props":478,"children":479},{"id":181},[480],{"type":26,"value":181},{"type":20,"tag":28,"props":482,"children":483},{},[484],{"type":26,"value":485},"JSON 响应可缓存于 CDN、Redis、本地，本文介绍缓存键设计与失效策略。 JSONDog 提供全套 JSON 在线工具，纯前端、零上传、中英双语，欢迎免费使用。",{"type":20,"tag":190,"props":487,"children":488},{},[489],{"type":26,"value":194},{"title":7,"searchDepth":196,"depth":196,"links":491},[492,493,494,495,496],{"id":383,"depth":196,"text":383},{"id":393,"depth":196,"text":393},{"id":56,"depth":196,"text":56},{"id":154,"depth":196,"text":154},{"id":181,"depth":196,"text":181},"content:blog:json-caching.md","blog/json-caching.md","blog/json-caching",{"_path":501,"_dir":5,"_draft":6,"_partial":6,"_locale":7,"title":502,"description":503,"date":10,"category":11,"keywords":504,"body":508,"_type":203,"_id":661,"_source":205,"_file":662,"_stem":663,"_extension":208},"/blog/json-form-data","JSON 与表单数据转换","前端表单常需与 JSON 互转，本文介绍序列化、嵌套表单与提交技巧。",[505,506,507],"json表单","form json","表单序列化",{"type":17,"children":509,"toc":654},[510,515,520,525,535,540,545,549,619,623,641,645,650],{"type":20,"tag":21,"props":511,"children":513},{"id":512},"json-与表单数据转换",[514],{"type":26,"value":502},{"type":20,"tag":28,"props":516,"children":517},{},[518],{"type":26,"value":519},"前端表单数据常需转为 JSON 提交 API，或将 JSON 回填表单，需处理嵌套与数组。",{"type":20,"tag":34,"props":521,"children":523},{"id":522},"转换方式",[524],{"type":26,"value":522},{"type":20,"tag":28,"props":526,"children":527},{},[528,530,533],{"type":26,"value":529},"FormData 遍历构建对象、name 用点路径表达嵌套、数组用 ",{"type":20,"tag":71,"props":531,"children":532},{},[],{"type":26,"value":534}," 后缀。",{"type":20,"tag":34,"props":536,"children":538},{"id":537},"库推荐",[539],{"type":26,"value":537},{"type":20,"tag":28,"props":541,"children":542},{},[543],{"type":26,"value":544},"qs、form-serialize、或框架内置（如 Vue v-model）。",{"type":20,"tag":34,"props":546,"children":547},{"id":56},[548],{"type":26,"value":56},{"type":20,"tag":60,"props":550,"children":552},{"className":62,"code":551,"language":64,"meta":7,"style":7},"{\"user\": {\"name\": \"x\", \"tags\": [\"a\", \"b\"]}}\n",[553],{"type":20,"tag":67,"props":554,"children":555},{"__ignoreMap":7},[556],{"type":20,"tag":71,"props":557,"children":558},{"class":73,"line":74},[559,563,568,572,577,581,586,590,595,600,605,609,614],{"type":20,"tag":71,"props":560,"children":561},{"style":78},[562],{"type":26,"value":81},{"type":20,"tag":71,"props":564,"children":565},{"style":84},[566],{"type":26,"value":567},"\"user\"",{"type":20,"tag":71,"props":569,"children":570},{"style":78},[571],{"type":26,"value":112},{"type":20,"tag":71,"props":573,"children":574},{"style":84},[575],{"type":26,"value":576},"\"name\"",{"type":20,"tag":71,"props":578,"children":579},{"style":78},[580],{"type":26,"value":92},{"type":20,"tag":71,"props":582,"children":583},{"style":143},[584],{"type":26,"value":585},"\"x\"",{"type":20,"tag":71,"props":587,"children":588},{"style":78},[589],{"type":26,"value":102},{"type":20,"tag":71,"props":591,"children":592},{"style":84},[593],{"type":26,"value":594},"\"tags\"",{"type":20,"tag":71,"props":596,"children":597},{"style":78},[598],{"type":26,"value":599},": [",{"type":20,"tag":71,"props":601,"children":602},{"style":143},[603],{"type":26,"value":604},"\"a\"",{"type":20,"tag":71,"props":606,"children":607},{"style":78},[608],{"type":26,"value":102},{"type":20,"tag":71,"props":610,"children":611},{"style":143},[612],{"type":26,"value":613},"\"b\"",{"type":20,"tag":71,"props":615,"children":616},{"style":78},[617],{"type":26,"value":618},"]}}\n",{"type":20,"tag":34,"props":620,"children":621},{"id":154},[622],{"type":26,"value":154},{"type":20,"tag":158,"props":624,"children":625},{},[626,634],{"type":20,"tag":162,"props":627,"children":628},{},[629],{"type":20,"tag":166,"props":630,"children":632},{"href":631},"/flatten",[633],{"type":26,"value":631},{"type":20,"tag":162,"props":635,"children":636},{},[637],{"type":20,"tag":166,"props":638,"children":639},{"href":168},[640],{"type":26,"value":168},{"type":20,"tag":34,"props":642,"children":643},{"id":181},[644],{"type":26,"value":181},{"type":20,"tag":28,"props":646,"children":647},{},[648],{"type":26,"value":649},"前端表单常需与 JSON 互转，本文介绍序列化、嵌套表单与提交技巧。 JSONDog 提供全套 JSON 在线工具，纯前端、零上传、中英双语，欢迎免费使用。",{"type":20,"tag":190,"props":651,"children":652},{},[653],{"type":26,"value":194},{"title":7,"searchDepth":196,"depth":196,"links":655},[656,657,658,659,660],{"id":522,"depth":196,"text":522},{"id":537,"depth":196,"text":537},{"id":56,"depth":196,"text":56},{"id":154,"depth":196,"text":154},{"id":181,"depth":196,"text":181},"content:blog:json-form-data.md","blog/json-form-data.md","blog/json-form-data",{"_path":665,"_dir":5,"_draft":6,"_partial":6,"_locale":7,"title":666,"description":667,"date":10,"category":11,"keywords":668,"body":672,"_type":203,"_id":799,"_source":205,"_file":800,"_stem":801,"_extension":208},"/blog/json-i18n","JSON 与国际化方案","JSON 是 i18n 资源文件常用格式，按语言分文件，键值映射文案。",[669,670,671],"json i18n","国际化json","多语言json",{"type":17,"children":673,"toc":792},[674,679,684,689,694,699,704,708,758,762,779,783,788],{"type":20,"tag":21,"props":675,"children":677},{"id":676},"json-与国际化方案",[678],{"type":26,"value":666},{"type":20,"tag":28,"props":680,"children":681},{},[682],{"type":26,"value":683},"JSON 是国际化资源文件的常用格式，按语言分文件，键值对映射文案。",{"type":20,"tag":34,"props":685,"children":687},{"id":686},"结构设计",[688],{"type":26,"value":686},{"type":20,"tag":28,"props":690,"children":691},{},[692],{"type":26,"value":693},"按语言分文件（en.json、zh.json），键用点路径或嵌套对象组织命名空间。",{"type":20,"tag":34,"props":695,"children":697},{"id":696},"使用",[698],{"type":26,"value":696},{"type":20,"tag":28,"props":700,"children":701},{},[702],{"type":26,"value":703},"前端 i18n 库加载对应语言 JSON，按键取文案，支持插值与复数。",{"type":20,"tag":34,"props":705,"children":706},{"id":56},[707],{"type":26,"value":56},{"type":20,"tag":60,"props":709,"children":711},{"className":62,"code":710,"language":64,"meta":7,"style":7},"{\"welcome\": \"欢迎\", \"login\": \"登录\"}\n",[712],{"type":20,"tag":67,"props":713,"children":714},{"__ignoreMap":7},[715],{"type":20,"tag":71,"props":716,"children":717},{"class":73,"line":74},[718,722,727,731,736,740,745,749,754],{"type":20,"tag":71,"props":719,"children":720},{"style":78},[721],{"type":26,"value":81},{"type":20,"tag":71,"props":723,"children":724},{"style":84},[725],{"type":26,"value":726},"\"welcome\"",{"type":20,"tag":71,"props":728,"children":729},{"style":78},[730],{"type":26,"value":92},{"type":20,"tag":71,"props":732,"children":733},{"style":143},[734],{"type":26,"value":735},"\"欢迎\"",{"type":20,"tag":71,"props":737,"children":738},{"style":78},[739],{"type":26,"value":102},{"type":20,"tag":71,"props":741,"children":742},{"style":84},[743],{"type":26,"value":744},"\"login\"",{"type":20,"tag":71,"props":746,"children":747},{"style":78},[748],{"type":26,"value":92},{"type":20,"tag":71,"props":750,"children":751},{"style":143},[752],{"type":26,"value":753},"\"登录\"",{"type":20,"tag":71,"props":755,"children":756},{"style":78},[757],{"type":26,"value":151},{"type":20,"tag":34,"props":759,"children":760},{"id":154},[761],{"type":26,"value":154},{"type":20,"tag":158,"props":763,"children":764},{},[765,772],{"type":20,"tag":162,"props":766,"children":767},{},[768],{"type":20,"tag":166,"props":769,"children":770},{"href":168},[771],{"type":26,"value":168},{"type":20,"tag":162,"props":773,"children":774},{},[775],{"type":20,"tag":166,"props":776,"children":777},{"href":176},[778],{"type":26,"value":176},{"type":20,"tag":34,"props":780,"children":781},{"id":181},[782],{"type":26,"value":181},{"type":20,"tag":28,"props":784,"children":785},{},[786],{"type":26,"value":787},"JSON 是 i18n 资源文件常用格式，按语言分文件，键值映射文案。 JSONDog 提供全套 JSON 在线工具，纯前端、零上传、中英双语，欢迎免费使用。",{"type":20,"tag":190,"props":789,"children":790},{},[791],{"type":26,"value":194},{"title":7,"searchDepth":196,"depth":196,"links":793},[794,795,796,797,798],{"id":686,"depth":196,"text":686},{"id":696,"depth":196,"text":696},{"id":56,"depth":196,"text":56},{"id":154,"depth":196,"text":154},{"id":181,"depth":196,"text":181},"content:blog:json-i18n.md","blog/json-i18n.md","blog/json-i18n",1787305466817]