EncodingChef

一个纯前端、单文件的在线编码转换工具。支持链式编码转换，类似 CyberChef 的操作体验。

特性

• 单文件部署: 构建产物为单个 index.html，零外部依赖，离线可用
• 14 种编码支持: UTF-8, UTF-16LE/BE, GBK, GB18030, Shift-JIS, EUC-JP, Big5, EUC-KR, ISO-8859-1, Windows-1252, ISO-2022-JP, KOI8-R, ISO-8859-5
• 链式操作: 支持多步骤编码转换，类似 Python 的 "...".encode("gbk").decode("utf-8")
• 多种输入格式: 原始文本、十六进制、Base64、转义序列
• 收藏与分享: localStorage 持久化 + URL hash 分享链接
• MD2 风格: Material Design 2 视觉风格，响应式布局
• XSS 安全: 所有用户输入通过 textContent 渲染

快速开始

安装依赖

pnpm install

开发

pnpm dev

构建

pnpm build

构建产物位于 dist/index.html，可直接打开使用。

测试

pnpm test

生成码表

pnpm generate-tables

从 WHATWG Encoding Standard 下载并生成编码映射表。

项目结构

encodingchef/
├── docs/expect/              # 需求文档
├── scripts/                  # 构建脚本
│   └── generate-tables.ts    # 码表生成脚本
├── src/
│   ├── __tests__/            # 单元测试
│   ├── components/           # Svelte 组件
│   ├── lib/
│   │   ├── encoding/         # 编码引擎
│   │   │   ├── tables/       # 生成的映射表
│   │   │   ├── index.ts      # 编码注册表
│   │   │   ├── types.ts      # 类型定义
│   │   │   └── ...           # 编解码器实现
│   │   ├── operations/       # 操作实现
│   │   ├── recipe/           # 配方管理
│   │   ├── security/         # XSS 防护
│   │   └── utils/            # 工具函数
│   ├── App.svelte            # 根组件
│   ├── app.css               # 全局样式
│   └── main.ts               # 入口
├── index.html                # HTML 入口
├── package.json
├── svelte.config.js
├── tsconfig.json
└── vite.config.ts

支持的操作

操作	描述
Encode	字符串 → 字节
Decode	字节 → 字符串
Hex View	字节 → 十六进制显示
Base64	Base64 编码
URL Encode	URL 编码
URL Decode	URL 解码
Byte Swap	大小端切换

错误处理

每个步骤支持三种错误处理策略：

• 跳过: 跳过无效字节，继续处理（会提示跳过了哪些位置）
• 替换字符: 替换为 � (U+FFFD)
• 中断: 遇到错误立即停止

分享配方

1. 构建好操作步骤链
2. 点击"分享"按钮
3. 复制生成的 URL 链接
4. 发送给他人，打开后自动加载配方

技术栈

• 框架: Svelte 5 (Runes)
• 构建工具: Vite + pnpm
• 单文件打包: vite-plugin-singlefile
• 编码标准: WHATWG Encoding Standard
• UI 风格: Material Design 2 (纯 CSS)

License

MIT