JSON 美化工具
chrome-extensionlaunched

JSON 美化工具

一个智能的 JSON 格式化工具,能够自动检测并美化网页中的 JSON 内容,让开发者更轻松地阅读和调试 JSON 数据。

小
作者
小路
58 浏览2025年10月上线
变现方式完全免费
⚡

技术栈

TypeScript

🔍 智能检测与自动格式化

  • ▸自动识别: 智能检测页面中的JSON和XML内容
  • ▸即时美化: 自动格式化检测到的JSON,提升可读性
  • ▸语法高亮: 彩色显示JSON结构,清晰展示数据层次
  • ▸错误容错: 智能处理不规范的JSON格式,尽可能完成解析

📝 手动输入与编辑

  • ▸独立工具页面: 点击扩展图标打开专用格式化页面
  • ▸实时预览: 输入JSON内容即时查看格式化结果
  • ▸格式切换: 在原始和格式化视图间自由切换
  • ▸多格式支持: 同时支持JSON和XML格式处理

基本使用

方式一:自动检测模式

  1. ▸访问包含JSON内容的网页(如API响应页面)
  2. ▸扩展会自动检测并格式化JSON内容
  3. ▸页面将显示美化后的JSON,支持语法高亮

方式二:手动输入模式

  1. ▸点击浏览器工具栏中的 🎨 扩展图标
  2. ▸在打开的独立页面中输入或粘贴JSON内容
  3. ▸实时查看格式化结果,支持复制和下载

核心技术

  • ▸Manifest V3: 采用最新的扩展架构标准
  • ▸JSON.parse/stringify: 原生JSON处理
  • ▸正则表达式: 内容类型检测和解析
  • ▸CSS语法高亮: 自定义样式实现代码高亮
  • ▸Blob API: 文件下载功能
  • ▸Clipboard API: 复制到剪贴板功能
📸

项目截图

Screenshot 1
Screenshot 2