我给在线JSON格式化工具加了个JSONPath筛选和排序的功能

|

我本来只是手痒,顺手把一个在线 JSON 格式化小工具丢上去了。没做宣传,也没抱指望。结果第二天就有点小动静,还有个朋友在公众号私信我。头像是个帅哥,语气很着急。

他的问题很实在,是这样的:

我的JSON 有点大,想把“某个前缀”的 key 全都找出来,拎成一份,方便复制。能不能做到?

我一看这诉求,心里突然想起,这不就是我自己也常干的事嘛。项目日志一大坨,上来先找 user_ 开头的,或者 meta. 开头的;平时总是 Ctrl+F 来回翻,累得眼睛疼。这事儿不该这么麻烦。

他发来一段示例 JSON,我在浏览器里滚来滚去,越看越觉得“嗯,必须得省事一点”。我讨厌那种把简单事搞复杂的工具,自己做就不能犯同样的错。

于是我想着干脆直接开做:加了一个“前缀筛一把”的功能。输入你要找的前缀,工具会把所有命中的 key 高亮出来,再把它们单独收成一份结果,点一下就能复制走人。逻辑很土:就是“把以 xxx 开头的都捞出来”。

准备动手的时候,突然想到,如果能用JSONPath进行筛选数据,那不是更加方便吗?JSONPath算是JSON配套的技术了,玩JSON的人应该基本上都知道JSONPath,即使不知道,我在页面稍作引导,应该也知道怎么玩吧。并且页面已经有了获取JSONPath的功能了,鼠标移动到想要获取JSONPath的JSON key,点击下获取JSONPath就可以得到啦,然后粘贴到筛选输入框中进行输入数据:

image-20250819222331284

于是最终,我加了一个根据JSONPath进行筛选数据的功能。筛选之后的内容可以直接通过复制按钮复制出来,清楚筛选的JSONPath之后,内容会还原到原来的样子。

具体效果可以直接体验:在线JSON工具 - IT宅

除了这种筛选,排序应该也是比较常用的功能,于是我一并更新上去了。期间还发现了一个问题,操作历史点击没法回退,顺手把这个问题给修了。

做完我自己试了两把,换了JSONPath,来回折腾了一会儿,心情挺舒坦然后我就把功能推上去了,也给那位朋友回了个消息:好了,去用吧。

现在回头看,我越来越喜欢这种节奏:有人来敲门,提了个具体需求,我就顺着做一个具体按钮。没有大而全,也不装系统化。工具小,小到能帮你省十分钟,它就值了。哪怕只帮到一两个同好,也开心。

如果你也有类似的场景,要把某个前缀的字段集中处理一下,来试试。顺带,如果你在用的时候有别的“就差这一下”的感觉,丢给我。我有时间会优先做80%的用户都会用到的功能。别端着,能顺手就行。