用 PyQt5 打造一个可视化 JSON 数据解析工具
写代码的日子里,你是不是经常遇到这种情况:
-
接口调试拿到一大串 JSON 数据,嵌套结构看得你头昏脑涨;
-
用 Notepad++ 或 VSCode 打开,缩进很乱,还容易漏字段;
-
想看某个字段的值,还得一层层展开手动找;
-
想提取某个字段,还得去写一段 json.loads() 然后调试。
有没有一种可能,让我们把这些麻烦都变得简单一点?
我用Trae 做了一个有意思的Agent 「Python工程师」。 点击 https://s.trae.com.cn/a/7c5aa9 立即复刻,一起来玩吧!
答案当然是:写一个图形化的 JSON 数据解析器。今天我们就来实现这样一个小工具 —— 使用 PyQt5 打造一款干净、简洁、实用的 JSON Viewer,它能快速格式化、展示、查找、导出 JSON 数据。
这个工具不光适合自己平时调试接口用,还可以打包给团队成员使用,让测试、产品也能直观查看 JSON 内容,再也不用你帮他们“翻译数据”。
添加图片注释,不超过 140 字(可选)
工具目标:让 JSON 一目了然
这款工具的核心目标很简单:
-
解析任意 JSON 字符串或文件
-
以树形结构展示嵌套字段
-
支持字段搜索、高亮定位
-
支持复制节点路径和值
-
支持格式化 / 压缩显示切换
-
支持导出为 .json、.txt 文件
-
支持拖拽 JSON 文件直接打开
说白了,它就是程序员调接口、做数据分析时的左膀右臂。
添加图片注释,不超过 140 字(可选)
关键功能拆解
1. JSON 导入与格式校验
用户可以通过三种方式导入 JSON:
-
粘贴到文本框内(手动输入)
-
选择本地 .json 文件打开
-
拖拽 JSON 文件到窗口
程序会实时校验输入是否合法,并提示错误位置。错误提示可以用 PyQt 的 QMessageBox 显示。
2. 树形结构展示(QTreeWidget)
将 JSON 数据递归解析成树形节点,是这个工具的核心。比如这样一段:
{ "id": 123, "name": "Alice", "roles": "admin" }
我们可以通过 QTreeWidgetItem 的递归构造来实现这种嵌套展示。
添加图片注释,不超过 140 字(可选)
3. 字段搜索与高亮
你是否也有过“我记得那个字段叫 token,但忘了在哪”的时刻?加一个“搜索字段”功能,可以极大提升效率:
-
输入关键词,匹配所有包含该关键词的字段名或字段值
-
匹配成功的节点自动展开,并高亮显示
-
支持上下跳转下一个匹配项
这个功能可以用 QTreeWidget 自带的遍历能力配合搜索框实现。
4. 节点右键菜单:复制路径 & 复制值
每个字段都可能是你调试用的关键数据点。右键节点时弹出菜单:
-
复制字段路径(如 user.roles[1])
-
复制字段值(如 editor)
-
展开/折叠当前节点
路径构造可以通过记录递归过程中的键名拼接实现。
5. 格式化/压缩切换
有些时候我们希望看“结构化”的 JSON,有时候则希望它更紧凑一些。加一个“格式化 / 紧凑”切换按钮即可:
-
格式化显示:带缩进、换行,美观可读
-
紧凑显示:一行 JSON,方便复制传参
这部分可以直接切换显示区的 JSON 字符串视图内容。
6. 导出功能
将当前 JSON 数据导出为 .json、.txt 文件,可以方便和其他人共享结果,或者做调试日志保存。
使用标准 QFileDialog 弹出保存窗口即可完成导出路径选择。
这个 JSON 可视化工具,虽然小巧,但几乎集成了 PyQt5 开发中所有重要知识点:
-
事件绑定
-
树形结构
-
文件处理
-
样式美化
-
异常处理
-
多窗口交互
它既能帮你解决日常开发中的“小痛点”,也能作为个人作品展示你的项目组织能力与用户体验意识。有了它,你再也不用苦哈哈对着 json.loads() 打断点了。