https://github.com/loggerhead/json4u-issue
https://github.com/loggerhead/json4u-issue
Last synced: 8 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/loggerhead/json4u-issue
- Owner: loggerhead
- Created: 2022-06-05T09:51:40.000Z (about 3 years ago)
- Default Branch: main
- Last Pushed: 2023-12-12T03:47:44.000Z (over 1 year ago)
- Last Synced: 2023-12-12T04:31:45.101Z (over 1 year ago)
- Size: 304 KB
- Stars: 1
- Watchers: 3
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
---
title: JSON For You 使用指南
---
**[JSON For You](https://json4u.com)** 是我找遍了市面上的同类工具，始终找不到符合全部需求的工具后，本着“自己动手，丰衣足食”的想法做的
JSON 工具箱。目标是对常用的 JSON 展示、处理功能提供最高的生产效率。由于是自用，所以：
1. 会持续更新、维护；
2. 不会轻易引入广告；
使用中有任何问题，或者希望支持新功能，都欢迎通过 [Feedback](https://github.com/loggerhead/json4u-issue/issues) 反馈。下面对
**[JSON For You](https://json4u.com)** 支持的功能做一个简单介绍。
## JSON 语义化比较
JSON 语义化比较（又被称作 JSON 结构化比较）是指忽略 JSON 中 key 的顺序，根据数据结构对两个 JSON
数据进行对比（类似于 `git diff`，只不过能理解数据的语义）。
拖拽文件或粘贴文本时，如果两侧编辑器都有内容，会自动进行比较。与一般的 JSON 对比网站不同，本站还提供了以下功能：
- **int64 比较**。在业务开发中 ID 通常会定义为 int64，而 js 的 number 只能精确表达 52bit
整数，此类字段如果前后端不做特殊处理，会丢失精度。为了快速找出这类差异，所以支持了 [Bigint](https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/BigInt)
比较的功能；
- **逐词比较**。有时候两个 JSON 数据只有很少的差别，比如：两个很长的字符串，但只有一两个词不一样，此时肉眼很难发现具体哪个地方不一致。所以支持了逐词比较，让你能一眼看出具体
diff；
- **数组差分比较**。如果两个 JSON 数组有差异，一般情况下我们其实不需要查看每一个元素的
diff，因为很可能会有比较多的噪音，并不方便我们肉眼查看。所以做了差分比较，提供与 `git diff` 一样简洁、人类可读的差异；
- **文本比较**。因为文本比较也是很常见的需求，所以支持了将无效 JSON 降级为文本比较（text diff），体验与 `git diff` 接近。效果如图：
- **差异跳转**。可以通过右键菜单或者快捷键快速跳转到下一个差异或上一个差异；
## 支持的 JSON 工具
左侧编辑器放置了 JSON 常用功能的按钮，其它功能可以通过点击右键菜单来使用。
- **JSON 校验**（JSON Validator）。有修改时会自动做校验。错误行会有标注，并提供充足的上下文帮助定位错误；
- **JSON 格式化**（JSON Formatter/Beautifier）。拖拽文件或粘贴后会自动格式化，即使是无效的 JSON
数据也能格式化；
- **JSON 最小化**（JSON Minify）。去除所有的空白字符，将 JSON 数据压缩成一行；
- **JSON 转义**（JSON Escape）。对 JSON 数据进行转义，增加 `\` 字符使其成为一个合法的字符串；
- **JSON 反转义**（JSON Unescape）。对 JSON 数据进行反转义，删除 `\` 字符使其成为合法的 JSON；
- **JSON 排序**（JSON Sort）。递归的对 key 做排序，但不会对数组做排序，排序前后的 JSON 在语义上是相等的。常用于排序后比较，让
diff 集中在一起，方便人眼查看；
- **显示 JSON 路径**（JSON Pointer/Path）。鼠标点击任意处，会展示对应 token
的 [JSON Pointer](https://datatracker.ietf.org/doc/html/rfc6901)。和 minimap 搭配使用，能帮助快速理解 JSON 的结构；
- **URL 转 JSON**。递归的解析 URL 转成一个 JSON。如果需要对比两个 URL 的 diff，先转成 JSON 再使用 diff 就非常方便；
- **[jq 命令行工具](https://jqlang.github.io/jq/tutorial/)**。jq 是一个非常强大的 JSON 处理工具，JSON For You 通过 Wasm
支持了 [jq 的全部功能](https://jqlang.github.io/jq/manual/v1.7/)，以满足更复杂的 JSON 过滤、处理等需求；
## 编辑器功能
除了支持 JSON 以外，常见的编辑器功能也是支持的：
- **折叠/展开**。鼠标移动到行号，会自动显示折叠图标，点击图标，可以折叠或展开；
- **拖拽文件**。拖动文件到编辑器中会自动读取文件内容，所有的数据传输都发生在本地，没有网络请求；
- **查找并替换**。支持查找并替换，支持正则表达式；
- **展示行号、列号**；
- **展示选中字符数**；
## 更新日志
- 2023-12-10:
- 支持 [jq 1.7](https://jqlang.github.io/jq/tutorial/) 全部功能；
- 优化 inline diff 性能；
- 优化 monaco CDN 缓存；
- fix 通过菜单项升序排序时未自动格式化的 bug；
- 2023-12-02:
- 支持 [jq](https://jqlang.github.io/jq/tutorial/) 核心功能；
- 优化格式化算法；
- fix guide 页无序列表样式问题；
- 2023-11-26:
- 支持嵌套解析；
- setting 自动读写 local storage；
- 将「去转义」按钮隐藏到「...」菜单中；
- 下线 try best to parse JSON 的功能；
- 2023-11-19:
- 支持自动排序、自动格式化开关；
- UI 调整；
- 2023-10-25:
- fix 隐藏块差异造成可读性差的问题；
- 2023-10-14:
- 比较无差异时，闪烁状态栏进行提示；
- 状态栏改为展示左右两侧的 diff 行数；
- fix 状态栏文字太长时的展示问题；
- 2023-10-06:
- 格式化等按钮改为作用于最后 focus 的编辑器；
- 支持关闭自动格式化；
- fix minimap 颜色错误；
- 2023-09-30:
- 调整 UI 配色，对齐 github；
- 支持展示选中的字符数；
- 改进 diff 算法，减少行内差异很多时对可读性的干扰；
- 2023-09-24:
- 文本 diff 支持填充块，增强阅读体验；
- 支持 JSON 排序后文本比较；
- 改进 diff 算法；
- 高亮差异时同时高亮行号；
- 下线 key 比较，避免同值 key 字段很多时（比如值为 0）难以查看 diff 结果；
- 「加载中...」换成动画；
- fix python 转 dict 部分 case 失败；
- 增加右侧编辑器默认大小；
- 支持跳转差异时从光标位置起跳；
- 2023-09-09:
- 支持显示当前光标所在位置；
- 改为块差异，让用户能更快跳转到不同差异；
- fix 清空状态栏 validate 不生效的问题；
- 2023-09-01:
- 支持更多折叠层级；
- 改进自动格式化算法；
- 跳转支持跳转到行内差异；
- 2023-08-26:
- 支持 Python dict 转 JSON（文本替换）；
- fix 解析错误上下文带 tag 时状态栏显示错误；
- fix 文本比较时右侧解析错误信息被左侧解析错误覆盖；
- 2023-08-22:
- 改进大文本的格式化性能；
- fix 状态栏并发更新导致的状态错误；
- 2023-08-19:
- 增加功能引导文案；
- 重构状态栏，优化文案展示逻辑；
- 改进同步滚动体验；
- 支持通过按住 Alt 键暂停同步滚动；
- 支持快捷键进行折叠/展开；
- fix 多个行内差异颜色叠加后颜色加深的问题；
- 2023-08-01:
- 2.0.0 上线；
- 2022-01-12:
- 1.0.0 上线；