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