一个安全、私密、极速的本地开发者工具箱。无需上传数据,100% 浏览器端本地计算。
简体中文 | English
- 🔒 100% 隐私安全 (Privacy First):所有文本比对、JSON 格式化、密码生成和数据编解码均在 浏览器本地 (Client-Side) 完成,绝不向任何外部服务器上传敏感数据(如 API 密钥、JWT 凭证、数据库密码等)。
- 🧩 高隐私浏览器扩展 (Privacy-First Browser Extension):
- 不申请高危权限:扩展不申请任何主机访问(Host Permissions)权限,绝不读取、不嗅探、不修改您所浏览的任何网页内容,彻底杜绝插件劫持或敏感凭证泄露风险。
- 完全离线运行:将完整的计算逻辑与静态资源打包在扩展内,零网络请求、零数据上传。
- 多浏览器兼容:一套代码原生适配 Chrome、Edge 和 Firefox。
- 🎨 极致交互体验 (Modern UI/UX):
- 基于 React 19 + TailwindCSS 4.0 打造的现代流线型界面。
- 支持 System/Light/Dark 三态主题,以及适用于全部工具的专注模式。
- 集成专业级 CodeMirror 编辑器,支持语法高亮和实时错误校验。
- 🔎 快速发现工具:支持按名称或关键词搜索、分类筛选、收藏和最近使用;偏好仅保存在浏览器本地。
- ⌨️ 键盘优先:按
Cmd/Ctrl + K打开命令面板,使用方向键与 Enter 快速切换工具。 - 🧠 智能识别与跨工具流转:仅在用户主动粘贴、拖放或选择文件后识别内容;统一复制、下载和“发送到”,可组合 JSON → YAML → Base64 → 码生成器。
- 🧵 大输入不卡界面:JSON 与结构化数据重计算在 Web Worker 中执行,支持进度、取消和输入大小提示。
- 📲 可安装网页应用:在线版支持安装为 PWA,并在空闲时缓存核心工具,后续可离线打开。
- 🚀 零配置部署 (Serverless Friendly):原生适配 Cloudflare Workers/Pages 边缘运行环境,预置 GitHub Actions 持续集成工作流。
您可以通过以下两种方式使用本工具箱:
-
🌐 在线网页版:
- 直接访问官方托管地址:https://tools.xcloudapi.com/
- 同样享有 100% 本地计算与隐私保护,页面一旦加载完成,即使断网也能继续使用。
-
🧩 浏览器扩展插件:
- 离线包形式运行,更安全、更快速。
- 拥有独立的 Popup 快捷面板入口,支持点击浏览器图标一键唤起。
- 支持 Chrome、Edge、Firefox 等主流浏览器(本地安装与打包方法请参见下文 🧩 浏览器扩展)。
- 双栏实时对比两段文本的差异。
- 高亮标识“新增(Green)”、“删除(Red)”和“修改(Yellow)”。
- 支持一键左右双向合并,轻松打补丁或复制结果。
- 支持拖动调整输入与差异区域、仅看输入或差异、自动换行和同步滚动。
- 基于 CodeMirror 提供行号、高亮和括号匹配。
- 支持一键美化(Format)与一键压缩(Minify)。
- 实时校验 JSON 语法,精准定位错误行数与原因。
- 输入与输出等高铺满可用空间,并可拖动调整左右占比。
- 针对 JSON 结构的深度对比。
- 对象路径对齐:自动忽略 JSON 键(Keys)的顺序差异,只比对具体值的变更。
- 支持可调双输入与差异结果布局、单区查看、同步滚动和快速重置。
- 强随机性字符生成。
- 可控参数:密码长度(1-256 位)、生成数量(1-1000 个)和字符集选择。
- 支持一键批量生成与安全复制。
| 类别 (Category) | 支持的方法 (Methods) | 说明 (Description) |
|---|---|---|
| 编码与加密 | Unicode / URL / UTF-16 编码 | 快速转义特殊字符与控制字符 |
| Base64 / Hex 编码 | 将文本转换成常用的二进制字符串表示 | |
| MD5 / SHA-1 / Gzip 压缩 | 计算本地文件或文本的哈希摘要,或压缩输出 Base64 | |
| HTML 实体 / 字符串转义 | 逃逸特殊字符,防止前端 XSS 攻击或生成代码字符串 | |
| 解码与解析 | Unicode / URL / UTF-16 解码 | 还原转义字符 |
| Base64 / Hex 解码 | 还原字节流为可读 UTF-8 文本 | |
| JWT 免签解析 | 快速解析 JSON Web Token (JWT) 的 Header 与 Payload | |
| URL 参数解析 / Cookie 格式化 | 将复杂的 URL Query 或 Cookie 字符串提取为排版后的键值对 | |
| Gzip 解压 | 还原压缩后的 Base64 文本数据 | |
| Proto Hex 解析 | 亮点功能! 直接将 Protobuf 的 Hex 十六进制原始数据解析为结构化 JSON 树 |
- 批量生成 UUID v4、UUID v7、ULID 和 URL 安全随机 Token。
- 使用浏览器安全随机数,支持一键复制单项或全部结果。
- 计算文本或本地文件的 MD5、SHA-1、SHA-256、SHA-384、SHA-512 摘要,文件采用流式处理。
- 支持 SHA-1、SHA-256、SHA-384、SHA-512 HMAC;MD5 与 SHA-1 会提示仅用于兼容旧校验值。
- 通过四个 Tab 分别提供时间戳转换、时区转换、Cron 后续时间和时间计算。
- 自动识别秒/毫秒 Unix 时间戳;支持常用 IANA 时区,并以
UTC±时差显示偏移量。 - 支持 5、6、7 字段 Cron(默认 5 字段),动态解析表达式含义、展示各字段范围,并按所选时区计算后续执行时间。
- 支持本地日期时间的时区转换,默认使用当前本地时间。
- 支持时间差计算,以及按年、月、日、时、分、秒进行组合加减。
- 实时展示匹配位置、捕获组、命名组和替换预览。
- 支持
g、i、m、s、uFlags,并通过说明提示每个开关的匹配意图。 - 内置邮箱、手机号、URL、IPv4、日期、时间、UUID、语义化版本、颜色和中文字符模板。
- 在 JSON、YAML、XML、TOML 和 CSV 之间转换。
- 对 JSON 输入执行 JSONPath 查询,并使用 JSON Schema 本地校验数据。
- 格式化 Standard SQL、MySQL、PostgreSQL、SQLite、SQL Server 与 PL/SQL。
- 解析 JWT Header、Payload 和时间声明,并明确提示过期、未生效或不安全算法。
- 使用浏览器 Web Crypto 和 JWK 在本地验证 HMAC、RSA、RSA-PSS 与 ECDSA 签名。
- Token 与密钥仅保留在当前页面内存,不写入历史或 URL。
- 采用二维码与条形码两个 Tab,保留独立输入和生成结果,方便后续扩展其他码制。
- 二维码支持自定义前景色、背景色、128–1024 px 常用尺寸,以及可选的本地图标上传。
- 支持 Code 128、Code 39、EAN-13、EAN-8、UPC-A、ITF-14 条形码。
- 切换条形码格式时自动展示字符、长度、示例和校验位要求;EAN、UPC、ITF 支持自动补充并验证校验位。
- 所有图片均在浏览器本地生成,可直接复制或下载,不会上传输入内容或图标。
- 应用框架: React 19 + TypeScript
- 构建工具: Vite 8 + Vinext (用于高性能多页边缘渲染)
- 样式引擎: TailwindCSS 4.0
- 核心组件:
- @uiw/react-codemirror - 集成专业代码编辑。
- @noble/hashes - 纯 JS 实现的加密哈希库.
- yaml / JSONPath Plus / @cfworker/json-schema - 本地数据转换、查询与 CSP 安全的 Schema 校验。
- qrcode - 浏览器内 QR Code 生成。
- JsBarcode - 浏览器内一维条形码生成。
- lucide-react - 现代化图标包。
- Node.js
>=22.15.0 - npm
>=10.0.0
- 克隆并进入项目目录:
git clone https://github.com/guanyang/dev-tools-box.git cd dev-tools-box - 安装依赖:
npm install
- 启动开发服务器:
启动后打开浏览器访问
npm run dev
http://localhost:3000。
- 运行完整测试套件(单元测试与 E2E 渲染测试):
npm test - 构建 Web 生产包:
npm run build
本项目支持在 Chrome、Edge 和 Firefox 浏览器中作为离线扩展运行。
无需安装 Node.js 或执行任何编译命令,即可直接加载使用:
- 打开 GitHub Releases 页面,下载对应浏览器的最新版压缩包(例如:
dev-tools-box-chrome-1.5.0.zip)。 - 将下载的 ZIP 压缩包解压到一个固定的本地文件夹中。
- 根据下文的 ⚙️ 浏览器加载指南 在浏览器中载入该解压后的文件夹即可。
如果您需要修改或二次开发扩展代码:
# 本地开发与实时调试 (以 Chrome 为例)
npm run extension:dev
# 编译生成生产包 (输出至 dist-extension/<browser>/ 目录)
npm run extension:build
# 编译并打包为版本化 ZIP (输出至 artifacts/ 目录)
npm run extension:package- Chrome / Edge:
- 打开地址栏输入
chrome://extensions/(或edge://extensions/)。 - 在右上角开启 开发者模式 (Developer Mode)。
- 点击 加载已解压的扩展程序 (Load unpacked)。
- 选择您解压出来的文件夹(如果是开发者,则选择项目目录下的
dist-extension/chrome或dist-extension/edge)。
- 打开地址栏输入
- Firefox:
- 临时安装(重启浏览器后失效):
- 打开地址栏输入
about:debugging#/runtime/this-firefox。 - 点击 临时载入附加组件 (Load Temporary Add-on)。
- 选择解压文件夹下的
manifest.json文件(如果是开发者,则选择项目目录下的dist-extension/firefox/manifest.json)。
- 打开地址栏输入
- 永久安装(重启不失效,推荐普通用户):
由于 Firefox 的安全策略,普通正式版 Firefox 不允许直接永久载入本地未签名的扩展。若需永久安装,可采用以下方法之一:
- 方法 1:自签名扩展包 (适用于所有 Firefox 版本)
- 将打包好的
.zip文件上传至 Firefox 附加组件开发者中心 (AMO)。 - 在发布选项中选择 “不在此网站上发布”(On your own / Unlisted)(仅用于自用签名,无需公开审核)。
- 提交后系统会在几分钟内完成自动安全扫描并完成签名。
- 下载签名后的
.xpi安装包文件,将其拖入 Firefox 的about:addons(扩展管理) 页面即可永久安装。
- 将打包好的
- 方法 2:使用 Firefox 开发者版 / Nightly / ESR 版本
- 打开地址栏输入
about:config并回车。 - 搜索
xpinstall.signatures.required并将其值双击修改为false。 - 打开
about:addons页面,点击右上角齿轮图标选择“从文件安装附加组件”,导入生成的扩展.zip或.xpi文件即可永久运行。
- 打开地址栏输入
- 方法 1:自签名扩展包 (适用于所有 Firefox 版本)
- 临时安装(重启浏览器后失效):
项目已集成对 Cloudflare Workers (Wrangler) 的原生支持,并配置了自动化 CI/CD:
- 每次将代码推送到
main分支时,.github/workflows/deploy-cloudflare.yml都会自动编译并运行测试。 - 智能增量部署:工作流会在构建后计算
dist/目录的 Hash 值。只有在构建产物发生变化时,才会执行实际的部署操作,节省构建资源。 - 发布 Release 时强制部署:当发布新 Release 时,工作流会绕过 Hash 校验,强制把当前 Release 版本的构建产物发布到 Cloudflare。
请在您的 GitHub 仓库 Settings -> Secrets and variables -> Actions 下配置以下 Secrets:
CLOUDFLARE_API_TOKEN:具有 Workers 管理权限 of Cloudflare API 令牌。CLOUDFLARE_ACCOUNT_ID:您的 Cloudflare 账户 ID。
项目提供了便捷的一键式 Tag 与 Release 管理流程:
- 确保在
CHANGELOG.md中记录了待发布的版本信息(例如## [v1.0.0] - 2026-07-11)。 - 在终端运行本地发布脚本:
./scripts/release.sh 1.0.0
- 脚本会自动进行 Git 工作区安全检查,确认版本号,打上版本 Tag,并将其推送到 GitHub。
- GitHub 上的
.github/workflows/release.yml收到 Tag 推送后,会自动执行:- 提取
CHANGELOG.md中对应版本的日志内容。 - 自动编译 Chrome、Edge、Firefox 扩展,并将其打包成
.zip包。 - 自动创建一个对应的 GitHub Release,并将扩展包
.zip作为 Assets 附件上传。
- 提取
本项目采用 MIT License 协议开源。
