设想一个很常见的工作场景:线上接口返回了一个奇怪的响应,你需要看看这段 JSON 到底长什么样。最快的做法通常是打开搜索引擎,找一个"在线 JSON 格式化"网站,粘贴进去。
问题在于,你粘贴进去的那段内容里,很可能含有 access token、用户手机号、内部接口地址、数据库连接串,或者一整个还没发布的配置。
关键区别在于:这段数据有没有离开你的设备
从你的角度看,两种网站长得一模一样。但后台的行为可能完全不同:
- 客户端处理:数据进到页面内存,用 JavaScript 处理完直接渲染。网络面板里只有页面本身的请求,没有你粘贴的内容。
- 服务端处理:数据被 POST 到对方服务器,处理完再返回。服务器上的访问日志、请求体日志、下游的 CDN 和 WAF,都可能留下完整副本。
后者的风险不是"对方一定是恶意的",而是你无法验证它做了什么,而且数据一旦离开你的设备,就再也收不回来了。
怎么快速判断一个工具站在哪一边
不用读源码,几个动作就够了:
- 打开浏览器开发者工具,切到网络面板。在工具里输入一段内容,看有没有产生新的请求。如果输入变化时不发请求,基本可以确定是本地处理。
- 断网试一次。页面加载完之后把网络断开,如果工具照常工作,那它就不可能依赖服务器。
- 看域名和描述。明确写"数据不出浏览器"并解释原理的,可信度通常高一些;只说"安全加密"却不说明白怎么做的,反而要留个心眼。
本地的代价和收益
本地处理不是没有代价。有些任务确实需要服务器:调用第三方 API、做重度的计算、需要共享状态的协作编辑。浏览器里的内存和算力也终究有限。
但对于"格式化 JSON""算个哈希""解码 JWT"这类任务,本地处理几乎没有短板:
- 延迟更低 —— 不用等一个来回的网络请求
- 没有隐私成本 —— 数据从头到尾没离开过内存
- 离线可用 —— 加载完就能用,飞机上也能干活
- 没有服务成本 —— 静态托管,也就不需要靠广告或者卖数据来维持
本站的做法
devtul.fun 上的 12 个工具全部是纯前端实现。页面加载完成后,你可以放心地断网 —— 它们照常工作,因为它们本来就不需要网络。
想验证的话很简单:打开任意一个工具页,按 F12 切到网络面板,然后随便粘一大段内容进去。你会看到请求列表一动不动。
这不是什么了不起的架构,只是把该留在本地的东西留在了本地而已。