📝 博客 · 2026-08-02 · ⏱ 13 分钟

JSON 格式化与校验:开发者必备工具推荐

JSON 格式化、压缩、校验、转换的完整教程,对比 5 款开发者常用工具,包含 JSON 错误排查、JSON 与 YAML/XML 互转技巧。

JSON格式化校验前端开发

JSON 格式化与校验:开发者必备工具推荐

调用 API 返回一坨没换行的 JSON、配置文件缩进错乱、前后端联调数据对不上——JSON 是 2026 年最常用的数据格式,但"乱"是它的常态。本文带你选对工具,秒级处理 JSON。

JSON 是什么

JSON(JavaScript Object Notation)是轻量级数据交换格式,2001 年由 Douglas Crockford 提出。它基于 JavaScript 语法但不依赖 JS,几乎所有编程语言都支持。

JSON 的 6 种数据类型

JSON 的常见错误

  1. 单引号{'name': 'Tom'} ❌ → {"name": "Tom"}
  2. 尾逗号{"a": 1,} ❌ → {"a": 1}
  3. 注释:JSON 不支持 ///* */
  4. 未引用 key{name: "Tom"}
  5. 特殊字符未转义:字符串中的 " 要写成 \"

5 款 JSON 工具对比

1. 52tool.net JSON 格式化(综合首选)

工具地址:JSON 格式化工具

实测功能完整,错误提示精准(行号 + 列号 + 错误原因)。

2. 52tool.net JSON 转 YAML

工具地址:JSON YAML 互转

3. VS Code(编辑器内置)

4. Postman(API 调试)

5. jq(命令行神器)

cat data.json | jq '.users[] | select(.age > 18) | .name'

实战教程:格式化杂乱 JSON

场景

调用 API 返回:

{"name":"Tom","age":25,"hobbies":["reading","coding"],"address":{"city":"Beijing","zip":"100000"},"friends":[{"name":"Jerry","age":24}]}

一坨没换行的字符串,肉眼根本看不清结构。

步骤 1:打开工具

进入 52tool JSON 格式化

步骤 2:粘贴 JSON

把上述字符串粘贴到左侧输入框。

步骤 3:自动格式化

工具自动检测并格式化,右侧显示美化结果:

{
  "name": "Tom",
  "age": 25,
  "hobbies": [
    "reading",
    "coding"
  ],
  "address": {
    "city": "Beijing",
    "zip": "100000"
  },
  "friends": [
    {
      "name": "Jerry",
      "age": 24
    }
  ]
}

步骤 4:调整缩进

可选 2/4 空格或 Tab 缩进,团队规范不同。

步骤 5:复制或下载

点击"复制"或"下载 JSON"按钮即可。

实战教程:JSON 错误排查

场景

JSON 解析报错 Unexpected token } at position 142,但肉眼看不出问题。

步骤 1:粘贴到格式化工具

进入 52tool JSON 格式化,粘贴 JSON。

步骤 2:查看错误提示

工具会标红错误位置,提示:

Error: Unexpected token } at line 5, column 12
提示:第 4 行末尾有尾逗号

步骤 3:定位并修复

跳转到第 4-5 行:

{
  "name": "Tom",   ← 第 4 行
  "age": 25,       ← 第 5 行
}                  ← 报错位置

原来是 25 后多了个逗号。删除逗号即可。

步骤 4:再次校验

修复后重新粘贴,工具显示"JSON 有效",可以放心使用。

实战教程:JSON 压缩

场景

配置文件 200KB,需要嵌入到 HTTP 请求体或脚本里,越小越好。

步骤 1:进入工具

52tool JSON 格式化

步骤 2:粘贴 JSON

粘贴完整 JSON。

步骤 3:点击"压缩"

工具移除所有空格、换行、缩进,输出单行 JSON:

{"name":"Tom","age":25,"hobbies":["reading","coding"]}

步骤 4:复制使用

体积从 200KB 压到 100KB(节省 50%),传输更快。

实战教程:JSON 与 YAML 互转

场景

K8s 配置用 YAML,但 API 返回 JSON,需要互转。

步骤 1:进入工具

JSON YAML 互转

步骤 2:粘贴 JSON

{
  "apiVersion": "v1",
  "kind": "Pod",
  "metadata": {
    "name": "nginx"
  }
}

步骤 3:点击"JSON → YAML"

apiVersion: v1
kind: Pod
metadata:
  name: nginx

步骤 4:反向转换

修改 YAML 后点击"YAML → JSON"转回 JSON。双向同步,方便对比。

进阶技巧

1. JSON Path 查询

大数据 JSON 里找特定字段:

$.users[?(@.age > 18)].name

52tool 的格式化工具支持 JSON Path 查询,输入路径立即显示匹配结果。

2. JSON Schema 校验

定义 Schema 描述 JSON 结构,校验数据是否符合规范。适合 API 接口验证:

{
  "type": "object",
  "properties": {
    "name": {"type": "string"},
    "age": {"type": "number", "minimum": 0}
  },
  "required": ["name"]
}

3. JSON 转 CSV

数组对象 JSON 转 Excel 可读的 CSV:

[{"name":"Tom","age":25},{"name":"Jerry","age":24}]

转成:

name,age
Tom,25
Jerry,24

4. Base64 编码 JSON

把 JSON 编码成 Base64 字符串嵌入 URL 或 Token:

{"user_id": 123}

eyJ1c2VyX2lkIjogMTIzfQ==

Base64 工具 一键转换。

5. jq 处理大型 JSON

GB 级 JSON 用浏览器卡死,用 jq 命令行处理:

# 提取所有用户名
cat huge.json | jq '.users[].name' > names.txt

# 过滤年龄大于 18 的用户
cat huge.json | jq '.users | map(select(.age > 18))' > adults.json

# 统计用户数
cat huge.json | jq '.users | length'

常见 JSON 错误及修复

1. 单引号

{'name': 'Tom'}

{"name": "Tom"}

2. 尾逗号

{"name": "Tom",}

{"name": "Tom"}

3. 注释

{"name": "Tom" /* 用户名 */}

✅ 删除注释,或改用 JSON5

4. 未转义字符

{"text": "He said "hello""}

{"text": "He said \"hello\""}

5. NaN/Infinity

JSON 不支持 NaNInfinity

{"value": NaN}

{"value": null}{"value": 0}

常见问题解答

Q: JSON 格式化工具支持多大文件?

A: 52tool.net 浏览器端处理,普通电脑能处理 10MB 以内的 JSON。更大的文件用 jq 命令行处理。

Q: JSON 能加注释吗?

A: 标准 JSON 不支持注释。需要注释用 JSON5(允许注释、单引号、尾逗号)或 JSONC(VS Code 用的 JSON with Comments)。52tool 工具支持 JSON5 解析。

Q: JSON 和 JSONP 有什么区别?

A: JSONP(JSON with Padding)是绕过同源策略的老技术,格式是 callback({...})。现代开发用 CORS 替代,JSONP 已很少用。

Q: JSON 顺序敏感吗?

A: 标准上对象键值对顺序无意义,但大多数解析器保留插入顺序。如果业务依赖顺序(如 ordered map),建议用数组 [{"key": "a", "value": 1}, ...]

Q: JSON 中数字精度会丢失吗?

A: 会。JavaScript 数字是 64 位浮点,超过 Number.MAX_SAFE_INTEGER(2^53 - 1)会丢精度。处理大整数(如雪花算法 ID)需要用字符串:{"id": "123456789012345678"}

Q: JSON 能存二进制数据吗?

A: 不能直接存。需要 Base64 编码成字符串:{"image": "data:image/png;base64,iVBOR..."}。但这样体积增加 33%。现代 API 用 multipart/form-data 或直接传 URL 引用。

Q: JSON Schema 和 TypeScript 接口有什么区别?

A: JSON Schema 是 JSON 描述 JSON 结构,运行时校验。TypeScript 接口是编译时类型检查,运行时不存在。两者可以互相转换(用 json-schema-to-typescript 等工具)。

总结

JSON 是 2026 年最重要的数据格式,52tool.net 的 JSON 格式化工具能覆盖 95% 的日常需求:格式化、压缩、校验、JSON Path、JSON5、YAML 互转全免费。重度用户配 jq 命令行处理大文件,VS Code 写 JSON 时实时校验。

写 JSON 时记住三条铁律:

  1. 双引号:键和字符串值都用双引号
  2. 无尾逗号:最后一个属性后不要逗号
  3. 无注释:要注释用 JSON5 或单独文档