实时语音识别 + 翻译系统,将单向音频流实时、流畅地翻译成目标语言,以字幕或语音形式呈现,帮助用户降低语言门槛,提升信息获取效率。
不依赖任何付费 LLM API Key,免费开箱即用。
- 实时语音识别 (ASR) — 浏览器内置 Web Speech API (Chrome/Edge 免费),无需任何 API 凭证
- 讯飞 ASR 备选 — 文件上传或非 Chrome 浏览器时自动回退到讯飞 rtasr 实时语音识别引擎
- 🈶 多语言互译 — 支持中↔英↔日↔韩等多种语言自由互译,目标语言可配置
- 📝 双语字幕 — 原文 + 译文双行字幕展示,适合观看演讲、会议、网课
- 🔊 语音播报 (TTS) — 集成 Web Speech API,将翻译结果以语音合成播报
- ✏️ 自动纠错 — API 级纠错机制:中间结果变化时自动修正,以删除线 + 箭头动画展示
- 上下文感知翻译 — 利用对话历史提升翻译连贯性和术语一致性
- 翻译润色 — 自动优化机翻结果,使其更自然流畅
- 智能纠错 — 根据上下文检测并纠正语音识别错误
- 会议纪要 — 自动生成结构化会议总结(主题、讨论点、结论、待办事项)
- 🎤 麦克风实时采集 — 一键开始/停止录音,支持空格键快捷操作
- 📁 音频文件上传 — 支持上传 MP3/WAV/MP4/WebM 等音视频文件,自动提取音频模拟实时流式播放
- 🌙 明暗主题切换 — 暗色/亮色主题一键切换,
localStorage持久化 - 🔠 字体大小调节 — 10px~28px 滑块实时调节字幕和列表字号
- ⛶ 全屏字幕模式 — 隐藏所有面板,仅保留超大双语字幕,按 ESC 退出
- 🖥️ 桌面悬浮字幕 — Document PiP API 悬浮窗,始终置顶,适合观看视频或在线会议
- 🔍 历史搜索 — 实时搜索过滤转录记录中的原文或译文
- 📊 实时统计 — 显示已识别语句数、自动纠正次数、录制时长
- 📄 记录导出 — 支持 SRT 字幕、TXT 纯文本、HTML 网页三种格式导出
- 双向互译 — 两人分别说不同语言时自动检测并翻译
- 对话气泡 UI — 左侧"你"蓝色气泡,右侧"对方"渐变色气泡
- 自动语言检测 — 基于字符集 (CJK/非CJK) 自动识别说话人
- 语言预设 — 中↔英、中↔日、中↔韩、英↔日 一键切换
┌──────────────────────────────────────────────────────┐
│ 浏览器 (前端) │
│ ┌──────────┐ ┌────────┐ ┌────────┐ ┌─────────┐ │
│ │ 麦克风 │ │ Web │ │ 字幕 │ │ TTS │ │
│ │ 采集 │→ │ Speech │→ │ 展示 │ │ 语音 │ │
│ │ │ │ API │ │ 界面 │ │ 播报 │ │
│ └──────────┘ └────────┘ └────────┘ └─────────┘ │
│ ↓ 文本/Float32 PCM │
│ ┌──────────────────────────────────────────────┐ │
│ │ WebSocket (ws://) │ │
│ └──────────────────────────────────────────────┘ │
└──────────────────────────────────────────────────────┘
│
┌───────────────────────┼──────────────────────────────┐
│ Node.js 后端服务器 │
│ ┌────────────────────┴──────────────────────────┐ │
│ │ WebSocket 中继 + 音频转换 │ │
│ │ Float32 → Int16 PCM (16kHz, 16bit, mono) │ │
│ │ 多语言翻译配置 + 历史记录管理 + 纠错追踪 │ │
│ └────────────────────┬──────────────────────────┘ │
│ │ │
│ ┌────────────────────┴──────────────────────────┐ │
│ │ 翻译引擎 (多层级回退) │ │
│ │ MyMemory → Google Translate → DeepSeek AI │ │
│ └────────────────────┬──────────────────────────┘ │
│ │ │
│ ┌────────────────────┴──────────────────────────┐ │
│ │ 讯飞 rtasr (备选 ASR, wss://) │ │
│ └───────────────────────────────────────────────┘ │
└──────────────────────────────────────────────────────┘
编辑 app/.env 文件:
# 服务端口
PORT=3000
# 讯飞 ASR API (可选 — 仅文件上传/非Chrome浏览器需要)
ASR_BASE_URL=wss://rtasr.xfyun.cn/v1/asr/ws
TRANSLATE_APP_ID=your_app_id
TRANSLATE_APP_SECRET=your_app_secret
# DeepSeek AI 功能 (可选 — 启用翻译润色、智能纠错、会议纪要)
DEEPSEEK_API_KEY=💡 Chrome/Edge 用户无需配置任何 API 凭证即可使用核心功能(浏览器内置语音识别 + MyMemory 免费翻译)。
cd app
npm install
npm start访问 http://localhost:3000,点击麦克风按钮或按空格键开始使用。
| 操作 | 说明 |
|---|---|
| 🎤 点击麦克风 | 开始/停止实时录音 |
| 空格键 | 快捷开始/停止 |
| ESC | 退出全屏字幕模式 |
| 📁 上传音频 | 选择音频文件模拟实时流播放 |
| 源语言/目标语言 | 实时切换翻译语言对 |
| 场景选择 | 切换识别场景(教育/科技/金融/医疗/法院/政府/企业) |
| TTS 开关 | 开启后自动播报翻译结果 |
| 🌙 主题切换 | 切换暗色/亮色主题 |
| 🔠 字体大小 | 滑块调节 10px~28px |
| ⛶ 全屏字幕 | 进入全屏字幕模式 |
| 🖥️ 桌面字幕 | 悬浮窗模式,支持麦克风/系统音频两种采集方式 |
| 💬 对话模式 | 两人双向互译,自动语言检测 |
| 🔍 搜索 | 在历史记录中搜索原文或译文 |
| 📄 导出 | 选择 SRT/TXT/HTML 格式导出完整转录记录 |
源语言:中文、英语、日语、韩语、法语、德语、西班牙语、俄语、自动检测。
目标语言:中文、英语、日语、韩语。前端语言选择自动映射为翻译 API 格式(如 zh → zh-CN)。
| 格式 | 文件扩展名 | 说明 |
|---|---|---|
| SRT | .srt |
标准字幕格式,可直接用于视频播放器 |
| TXT | .txt |
纯文本,带时间戳的双语对照 |
| HTML | .html |
可打印的表格页面,支持浏览器打印为 PDF |
- 后端: Node.js + Express + ws + dotenv
- 前端: 原生 HTML/CSS/JS (Web Audio API + Web Speech API + WebSocket)
- 音频格式: PCM 16kHz 16bit 单声道
- 传输协议: WebSocket (ws)
- ASR: 浏览器 Web Speech API (Chrome/Edge, 免费) + 讯飞 rtasr (备选)
- 翻译: MyMemory 免费 API → Google Translate 备选 → DeepSeek AI 润色 (可选)
- TTS: Web Speech API
app/
├── server.js # 后端服务器 (WebSocket 中继 + REST API + 导出 + AI)
├── package.json # 依赖配置
├── .env # 环境变量 (API 凭证等)
├── README.md # 项目文档
└── public/
├── index.html # 前端页面 (6模块导航系统)
├── style.css # 样式表 (含暗色/亮色主题 + 全屏/桌面模式)
└── app.js # 前端核心逻辑
| 方法 | 路径 | 说明 |
|---|---|---|
| GET | /api/health |
健康检查 |
| GET | /api/history/:sessionId |
获取当前会话历史记录 |
| GET | /api/export/:sessionId?format=srt|txt|html |
导出转录记录 |
| POST | /api/refine |
重新翻译 |
| POST | /api/ai/translate-context |
AI 上下文感知翻译 |
| POST | /api/ai/polish |
AI 翻译润色 |
| POST | /api/ai/correct |
AI 智能纠错 |
| POST | /api/ai/summary |
AI 会议纪要生成 |
| POST | /api/ai/config |
保存 AI API Key |
| GET | /api/ai/status |
AI 服务状态 |
| WS | /ws |
实时 WebSocket 通信 |
| 类型 | 方向 | 说明 |
|---|---|---|
asr_text |
客户端→服务器 | 浏览器识别的文本 |
config |
客户端→服务器 | 语言/场景配置 |
asr |
服务器→客户端 | ASR 识别结果 |
translation |
服务器→客户端 | 翻译结果 |
translation_polished |
服务器→客户端 | AI 润色后的翻译 |
status |
服务器→客户端 | 连接状态/会话信息 |
error |
服务器→客户端 | 错误信息 |
| 快捷键 | 功能 |
|---|---|
| 空格 | 开始/停止录音 |
| ESC | 退出全屏字幕模式 |
{
"express": "^4.x",
"ws": "^8.x",
"dotenv": "^16.x"
}无前端构建工具,无 TypeScript,无框架依赖 (vanilla JS)。
- 初始实现 — 集成 MyTranslate 封装 API
- 切换讯飞 rtasr — 原生 API (ASR-only)
- 新增 Google Translate — 免费翻译替代方案
- 导出功能 — SRT/TXT/HTML 三种格式
- 明暗主题 — 主题切换 + localStorage 持久化
- 字体调节 — CSS 变量动态字号
- 全屏字幕 — 大字模式 + ESC 退出
- 历史搜索 — debounce 150ms 实时过滤
- 2026-06-06 — 导航模块重构:NAV 路由系统,模块生命周期 enterModule/leaveModule,CSS has-settings 侧边栏布局
- 2026-06-06 — 讯飞 ASR 鉴权修复:更正 API 路径
/v1/asr/ws,参数source_lang,签名算法匹配官方 SDK - 2026-06-06 — 切换为浏览器 Web Speech API:Chrome 内置语音识别(免费),MyMemory 翻译替代 Google(国内可用)
- 2026-06-06 — 字幕区域滚动优化
- 2026-06-07 — 桌面字幕模块:Document PiP API 悬浮窗(始终置顶)、麦克风/系统音频双模式、音频设备选择器(立体声混音/Stereo Mix)、纯字幕模式(透明背景+金色译文)、透明度滑块
- 2026-06-07 — 对话模式模块:双向互译、对话气泡 UI、自动语言检测(CJK/非CJK)、语言预设快捷切换、对话历史管理与搜索、AI 会议纪要生成
- 2026-06-07 — DeepSeek AI 集成:翻译润色、上下文感知翻译、智能纠错、会议纪要生成、AI 状态指示器、逐条目润色按钮
- 2026-06-07 — UI/UX 优化:首页 6 宫格 (3×2) 卡片布局、响应式网格适配、AI 润色标记
✨AI+ 紫色边框高亮 - 2026-06-07 — Bug 修复:updateHistoryEntry 过渡到 final、asr_text 对话模式参数支持、PiP 回退模式字幕更新、音频缓冲上限 30s、讯飞重连上限 3 次