JSON 树形查看器,免费
在下方粘贴 JSON 数据,以交互式、可折叠的树形视图查看,值按类型着色。
工作原理
- 粘贴您的 JSON:在输入区粘贴任意 JSON 字符串 · 对象、数组或嵌套结构均可。
- 浏览树形结构:JSON 以可交互、可折叠的树形显示。点击节点即可展开或折叠其子项。
- 导航与检查:通过展开分支查找特定的键或值。让深层嵌套的数据一目了然。
为什么使用 JSON 树形查看器?
当 API、配置文件和数据库产出的原始 JSON 带有深层嵌套结构时,阅读起来极为困难。JSON 树形查看器将扁平文本转化为分层的可视地图,让您一眼看清数据的形状、发现缺失的键、追踪嵌套路径并理解结构 · 无需在脑中解析大括号和逗号。这是 API 调试、数据探索和理解 schema 的必备工具。
功能特性
- 交互式树:展开和折叠任意分支,让您专注于感兴趣的数据部分。
- 语法高亮:键、字符串、数字、布尔值和 null 分别着色,便于快速识别。
- 支持深层嵌套:可处理任意深度的嵌套对象和数组,不限大小。
- 错误检测:无效的 JSON 会在渲染前以清晰的错误信息标记。
- 基于浏览器:不上传服务器 · 您的 JSON 数据完全保留在浏览器中。
常见问题
JSON 输入有大小限制吗?
工具本身不强制限制。性能取决于您的浏览器和设备。非常大的 JSON 文件(数 MB)可能加载较慢,但常见的 API 响应和配置文件可瞬间显示。
可以在树形视图中编辑 JSON 吗?
此工具侧重于 JSON 结构的可视化和浏览。如需编辑 JSON,请使用 JSON 格式化工具,它在格式化输出旁提供完整的编辑器。
支持带注释的 JSON(JSONC)吗?
标准 JSON 不允许注释,大多数解析器(包括此工具)会将其标记为错误。请在粘贴前移除注释,或使用支持 JSONC 的编辑器处理带注释的 JSON。
JSON,胜出的数据格式
Douglas Crockford 于 2001 年在 json.org 上发布了 JSON,作为 XML 的轻量级替代方案,直接从 JavaScript 的对象字面量中提取语法。该格式首先在 RFC 4627(2006 年 7 月)中作为 IETF Internet-Draft 标准化,然后修订为 RFC 7159(2014 年 3 月),最终在 RFC 8259(2017 年 12 月)中确定,这是当前的标准,并与 ECMA-404(第 1 版 2013 年 10 月,第 2 版 2017 年 12 月)保持一致。RFC 8259 增加了一个重要要求:网络层编码必须是 UTF-8。两个补充规范完善了生态系统:RFC 6901「JSON Pointer」(2013 年 4 月)定义了 /store/book/0/title 语法,用于寻址文档内的节点,RFC 6902「JSON Patch」定义了一个 JSON 文档,描述要应用于另一个 JSON 文档的更改。JSON Schema(当前 IETF 草案 2020-12)添加了验证。基于此构建的其他一切,用于配置文件注释的 JSONC、用于宽松语法的 JSON5、用于流的 NDJSON,都出现在后来。
六种 JSON 值类型(以及缺少的内容)
RFC 8259 §3 恰好定义了六种值类型。没有别的。
- 对象:由花括号分隔的无序名称-值对集合。键始终是字符串。
- 数组:由方括号分隔的有序值列表。可以包含混合类型。
- 字符串:双引号内的 Unicode 字符。单引号不是合法的 JSON。
- 数字:IEEE 754 双精度浮点数。规范不保证任意精度;超过
Number.MAX_SAFE_INTEGER= 2⁵³ − 1 = 9 007 199 254 740 991 的数字在解析时会丢失精度。 true/false:布尔字面量,小写,不带引号。null:null 字面量,小写,不带引号。值为null的键与不存在的键不同。
JSON 没有的:日期类型(惯例是带时区的 ISO 8601 字符串)、注释(使用单独的元数据字段)、尾随逗号、单引号字符串、十六进制数字、undefined、NaN 或 Infinity。任何这些都会让 JSON.parse 抛出 SyntaxError。
严格 JSON、JSONC、JSON5:哪个是哪个
严格 JSON(RFC 8259)是此查看器接受的:无注释、无尾随逗号、双引号键、双引号字符串。JSONC 是微软在 VS Code 中提供的约定,允许 // 行注释和 /* ... */ 块注释,同时保持其他所有内容严格;您可以在 tsconfig.json、.vscode/settings.json 和 jsonc-parser npm 包中看到它。JSON5(2017,https://json5.org)是一个超集,添加了单引号字符串、未加引号的键、尾随逗号、十六进制数字、IEEE 754 特殊值(NaN、Infinity)以及行和块注释;json5 npm 包每周大约有 1000 万次下载。NDJSON / JSON Lines(https://jsonlines.org)是一种流变体,其中每一行都是一个独立的 JSON 文档,被日志运输器和大数据摄取管道使用。如果您的源是 JSONC 或 JSON5,请在粘贴前去除注释和尾随逗号。
树查看器真正赚到工资的地方
- API 响应检查。Stripe、GitHub、Slack、Twilio:每个现代 API 都返回嵌套的 JSON。粘贴到树查看器中使形状变得明显。
- 配置文件。
package.json、tsconfig.json、composer.json、kubeconfig,以及云提供商 JSON 配置的长尾,都变得更容易作为树进行审计。 - 数据库导出检查。MongoDB
find()输出、PostgreSQLrow_to_json行、ElasticSearch 命中列表。 - 模式发现。当 API 没有文档时,树查看器就是文档。
- 差异准备。在两个文件之间运行
json-diff或jq之前,在查看器中检查每个,手动发现明显的差异。 - Webhook 有效负载检查。Stripe、GitHub、SendGrid 和类似服务都发送 JSON webhooks。粘贴有效负载到查看器是验证您的端点将接收什么的最快方法。
- 样本数据制作。通过键入 JSON 来构建测试装置,并观察树增量更新;在保存文件之前捕获缺少的括号。
处理 JSON 时常见的错误
- 尾随逗号。
{"a": 1,}是合法的 JavaScript 但非法的 JSON。JSON.parse抛出SyntaxError: Unexpected token '}'。去除它们或切换到 JSON5。 - 注释。
// 像这样或/* 像这样 */在 JavaScript 和 JSONC 中有效,但在严格的 JSON 中无效。 - 大整数精度损失。Twitter 和 Stripe ID 可能超过 2⁵³;
JSON.parse("9007199254740993")返回9007199254740992。如果精度很重要,请将它们作为字符串接收。 - 混淆
null与不存在。{"foo": null}将foo定义为 null;{}将foo未定义。这种区别对 API 合同和数据库 NULL 处理很重要。 - 重复的键。RFC 8259 表示行为未定义;在实践中,每个 JS 引擎都保留最后一个值。
{"a": 1, "a": 2}解析为{a: 2}。 - 循环引用。
JSON.stringify抛出TypeError: Converting circular structure to JSON。展平循环,使用替换器,或使用像flatted这样的库。 - 没有时区的日期字符串。
"2026-05-12"是模糊的;"2026-05-12T18:30:00Z"是 UTC 中明确的 ISO 8601。始终包含偏移量。
更多常见问题
此查看器可以处理多大的 JSON 文件?
在 V8 中使用 JSON.parse 解析 1 MB 大约需要 10 毫秒。渲染 100,000 个折叠的 DOM 节点可能会冻结浏览器几秒钟。在实践中,此查看器最多舒适处理 约 5 MB;超过此,预计渲染时会有明显延迟。对于较大的文档,在 Web Worker 中使用像 stream-json 这样的流解析器,或将输入分页成块。
为什么我的大整数返回错误?
JavaScript 数字是 IEEE 754 双精度浮点数。最多 2⁵³ − 1 = 9 007 199 254 740 991 的整数会精确地完成一次往返;超过这个范围,精度就会丢失。Twitter snowflake ID(64 位)、Stripe 客户 ID、区块链交易 ID 以及许多数据库代理键都超过这个限制。JSON.parse 会静默地截断。修复方法是将 ID 作为字符串接收(大多数现代 API 都这样做),或使用支持 BigInt 的库进行解析。
什么是 JSON Pointer,我会在哪里使用它?
RFC 6901(2013 年 4 月)定义了用于寻址 JSON 文档内节点的路径语法:/store/book/0/title 选择 store 数组中第一本书的标题。JSON Pointer 是 JSON Patch(RFC 6902)的基础,它将文档增量表达为指针和操作对的数组。Kubernetes API 服务器使用 JSON Patch 进行增量更新;GitHub 的 REST API 和许多其他系统也是如此。
NDJSON / JSON Lines 在此查看器中工作吗?
不。NDJSON 是每行一个独立的 JSON 值,没有包含数组。整个文件上的 JSON.parse 抛出错误,因为第二行从第一个对象结束的地方开始。将整个内容包装在 [ 和 ] 中,并用逗号替换每个对象之间的新行,或一次粘贴一行,或使用专用的 NDJSON 查看器。
我的 JSON 会发送到哪里吗?
没有。JSON.parse 在您浏览器的 JavaScript 引擎中运行,树作为本地 DOM 节点呈现,并且您的数据副本不会通过网络发送。这对带有秘密、客户数据或 PII 的 API 响应是安全的。在 DevTools 中打开网络选项卡并粘贴样本:您将在解析和渲染期间看到零个出站请求。