![987441c10233fbcf69494a0b611ab5a3.gif](https://img-blog.csdnimg.cn/img_convert/987441c10233fbcf69494a0b611ab5a3.gif)
JSON Hero 是一个简单实用的 JSON 工具,通过简洁美观的 UI 及增强的额外功能,使得阅读和理解 JSON 文档变得更容易、直观。
支持多种视图以便查看 JSON:列视图、树视图、JSON 视图等 列视图是受 macOS Finder 启发创建的一种浏览 JSON 文档的新方法。
![40274729a34c17078265e89f2d712b61.png](https://img-blog.csdnimg.cn/img_convert/40274729a34c17078265e89f2d712b61.png)
项目地址:https://github.com/jsonhero-io/jsonhero-web
1本地安装(可选)
要在本地运行 JSON Hero,首先 clone 源代码,并安装相关依赖项:
git clone https://github.com/jsonhero-io/jsonhero-web.git
cd jsonhero-web
npm install
然后运行以下命令启动,打开 http://localhost:8787 即可使用:
npm start
2直接使用
前往 https://jsonhero.io/ 并将 JSON 文件拖拽到网站上,或在提供的表单中粘贴 JSON 或 JSON url
内容预览
JSON Hero 会自动推断字符串的内容,并对选择的值提供有用的预览和属性。
日期和时间
![5f4d0a64b573a555bd792e3648c4af79.png](https://img-blog.csdnimg.cn/img_convert/5f4d0a64b573a555bd792e3648c4af79.png)
图片网址
![ff1f071c99d57d81b7d512d35acd0817.png](https://img-blog.csdnimg.cn/img_convert/ff1f071c99d57d81b7d512d35acd0817.png)
网站网址
![94ab531464c3cfd79cdc525afd01f1e0.png](https://img-blog.csdnimg.cn/img_convert/94ab531464c3cfd79cdc525afd01f1e0.png)
JSON URL
树状视图
这个也是用的最多的,树状图结构可以很清晰的展示,看一组图:
![7bbd223d2fa44129bb9b4269e87654ac.jpeg](https://img-blog.csdnimg.cn/img_convert/7bbd223d2fa44129bb9b4269e87654ac.jpeg)
同时支持对JSON数据中的数据进行搜索:
![c656cefc995e8a28a1060f0e4bfe05c3.gif](https://img-blog.csdnimg.cn/img_convert/c656cefc995e8a28a1060f0e4bfe05c3.gif)
重点来了!
当你完成数据编辑或者审核后,需要分享给前端,不必复制全部数据,只需要生成指定链接即可,这个很方便。
![2d437e2a0bc8b27c078dc33d4351c3dc.jpeg](https://img-blog.csdnimg.cn/img_convert/2d437e2a0bc8b27c078dc33d4351c3dc.jpeg)
整体来讲,JSON Hero 支持多种视图查看JSON数据,同时支持VS Code 等扩展,相信对经常处理JSON的小伙伴来说,是一款很给力的工具。
来源:blog.csdn.net/mashibingjiaoyu/article/details/126904804
·················END·················
资料链接
清华学姐自学的Linux笔记,天花板级别!新版鸟哥Linux私房菜资料阿里大佬总结的《图解Java》火了,完整版PDF开放下载!
Alibaba官方上线!SpringBoot+SpringCloud全彩指南国内最强的SpringBoot+Vue全栈项目天花板,不接受反驳!