CodeKitHub
JSON 工具

JSON 在线格式化工具

最后更新:

把 JSON 粘贴到下方输入框,一键格式化、美化或压缩。工具会在格式化的同时校验 JSON 语法,如果有错误会显示具体原因。全部处理都在浏览器本地完成,数据不会上传到任何服务器。

使用方法

  1. 把 JSON 粘贴到左侧输入框(也可以点"加载示例"先试试)。
  2. 选择 2 空格或 4 空格缩进。
  3. 点"格式化"进行美化,或点"压缩"把 JSON 压成一行。
  4. 如果 JSON 有语法错误,查看输入框下方的错误提示定位问题。
  5. 点"复制"把结果复制到剪贴板。

示例

输入

{"name":"CodeKitHub","tools":["json","base64"],"free":true}

输出

{
  "name": "CodeKitHub",
  "tools": [
    "json",
    "base64"
  ],
  "free": true
}

同样的数据,用 2 空格缩进格式化后的效果。"压缩"则相反:去掉所有空白字符。

工具介绍

JSON 格式化工具可以把压缩成一行、难以阅读的 JSON 文本,重新排版成带缩进和换行的易读格式。JSON 是目前 API 接口、配置文件和日志系统中最常用的数据格式,但服务器为了节省带宽,返回的通常是压缩成一行的内容,肉眼几乎无法阅读。

这个工具同时也是 JSON 校验器:它使用和浏览器完全相同的严格解析规则。如果你的 JSON 少了逗号、键名没加引号、或者末尾多了逗号,都会直接显示具体的错误信息,而不是悄悄失败。

JSON 由两份相互一致的标准正式定义:RFC 8259 和 ECMA-404——而且这套规范有意比 JavaScript 本身更严格,这就是为什么一段能作为 JS 代码正常运行的片段,在这里做严格 JSON 校验时仍可能不通过。

实用技巧

  • 调试接口时,先原样粘贴返回、再格式化——校验器会精确指出语法问题所在的行列,比盯着一行天书找错高效得多。
  • 屏幕阅读用 2 空格缩进;把 JSON 塞进 URL、环境变量或聊天消息前先压缩——那些场景里空白纯属浪费字节。
  • 手写配置"看着没问题"却校验失败,最常见的两个原因是 JSON5 风格的注释和尾随逗号:严格 JSON 两者都不允许。
  • 特别大的文件(日志、数据库导出)只格式化你关心的片段——编辑器不卡,结构也更容易看清。

真实工作流中的位置

最常见的完整流程是:接口在令牌或 webhook 里返回 Base64 包裹或压缩过的 JSON。第一步解 Base64,第二步格式化 JSON,环境之间行为不一致时第三步对比两份返回。每一步本站都有专门工具,而且任何一步你的数据都不离开浏览器。

前端工程师用压缩方向的频率不比格式化低:要发布一个大的静态 JSON 文件?压缩通常能在 gzip 之前先省 20–30%。

Base64 编码解码 · 文本对比

常见 JSON 错误及修复方法

绝大多数"JSON 无效"的报错都出自几个固定的老问题。下表整理了手写配置文件或调试复制粘贴的接口返回值时最常遇到的几种。

错误类型示例修复方法
尾随逗号{"a": 1, "b": 2,}删掉对象或数组最后一项后面多余的逗号。
单引号{'a': 1}JSON 的键和字符串值都必须用双引号。
键名没加引号{a: 1}每个键都要用双引号包起来:{"a": 1}。
写了注释{ // 备注\n "a": 1 }严格 JSON 不支持任何注释语法——校验前先删掉 // 和 /* */ 注释。
漏写逗号{"a": 1 "b": 2}每对键值之间要用逗号分隔。
NaN / undefined / Infinity{"a": NaN}这些是合法的 JavaScript 值,但不是合法的 JSON——改用 null 或字符串代替。

常见使用场景

  • 读一个压缩成一行、完全没法看的API返回值,调试时先弄清楚它的结构。
  • 校验一个配置文件(比如package.json或JSON格式的设置文件)为什么应用读取时莫名出错。
  • 在bug报告、代码review或文档里分享一段格式清晰的JSON片段。
  • 把JSON压缩到最小体积,再嵌入URL参数或存进有大小限制的数据库字段。

为什么使用它?

接口返回了一坨压缩成一行的报错响应?粘贴进来,立刻看清到底是哪个字段出的问题,不用在一整屏文字里数括号。

构建报错"Unexpected token in JSON at position 214"却没给别的线索?把文件贴进来,错误提示会直接指出具体的行和列。

准备把配置对象塞进 script 标签或通过慢速接口发出去?先压缩一下,数据离开你的机器之前就先把空白省掉。

正在调试的 JSON 里有用户身份证号或 API 密钥这类敏感字段?处理全在本地完成,不需要为了看一眼就上传到第三方服务器。

在 code review 里看同事提交的一份压缩过的 JSON 测试数据?先在这里格式化,diff 才能看出真正改了什么。

没有注册墙拦在中间——凌晨排查线上问题时用手机打开也一样能用。

常见问题

我的 JSON 数据会被上传到服务器吗?

不会。这个工具完全通过浏览器内的 JavaScript 运行,你的 JSON 不会离开你的设备,处理敏感数据或公司内部数据也是安全的。

为什么提示我的 JSON 无效?

最常见的原因有:逗号缺失或多余、键名没有用双引号、用了单引号而不是双引号、最后一项后面有多余的逗号、以及 JSON 中写了注释(JSON 标准不支持注释)。输入框下方的错误信息会告诉你解析器发现了什么问题。

格式化和压缩有什么区别?

格式化会添加缩进和换行,让 JSON 便于人阅读;压缩则去掉所有不必要的空白字符,让 JSON 体积最小,适合传输或嵌入代码。

有大小限制吗?

工具本身没有限制。非常大的文件(几十 MB)可能会因设备性能而变慢,因为所有处理都在你的浏览器本地进行。

能自动修复损坏的 JSON 吗?

不能。工具会准确告诉你 JSON 哪里出错,方便你自己修复,但不会猜测或修改你的数据——自动"修复"可能掩盖真正的 bug,这是有意的设计。

支持 JSON5 或 JSONC(带注释、尾随逗号、键名不加引号)吗?

不支持,这是有意为之——本工具按严格的 RFC 8259 标准校验,也就是你的接口和 JSON.parse() 实际要求的格式。如果要格式化 tsconfig.json 或 VS Code 设置这类 JSONC 配置文件,先把注释删掉,否则解析器会把它们当作错误。

这个工具和直接在浏览器控制台跑 JSON.stringify 有什么区别?

JSON.stringify(JSON.parse(x), null, 2) 效果类似,但你得先打开控制台,而且遇到无效输入只会抛出一个笼统的报错,不会像本工具这样精确指出出错的行和列。

能处理特别深层嵌套的 JSON 吗,比如 GraphQL 返回值?

可以,没有人为设置的嵌套深度限制,只受浏览器内存和你想滚动多远的实际限制。深层嵌套的结构恰恰最需要格式化——压成一行之后超过 3-4 层基本就没法读了。

断网之后还能用吗?

可以。页面加载完成后,所有解析和格式化逻辑都在本地 JavaScript 中运行,断网也能继续格式化 JSON。

相关工具