文本转语音(TTS)速查表
浏览器原生的 Web Speech API 就能把文字读出来,无需后端、不花钱。本页整理朗读的核心参数、SSML 常用标签与移动端/Safari 的兼容坑,帮你把「网页朗读」做得自然稳定。
核心朗读参数
| 参数 | 含义 | 调参建议 |
|---|---|---|
| rate(语速) | 朗读速度,1 为正常,范围约 0.1–10 | 中文建议 0.9–1.1,过快会吞字;英文可到 1.2 |
| pitch(音高) | 音调高低,1 为默认,范围约 0–2 | 微调 ±0.1 即可区分角色,别拉太极端 |
| volume(音量) | 音量,1 为默认,0 为静音 | 网页里通常保持默认,交给系统音量 |
| voice(音色) | 选择具体发音人,含语种与性别 | 用 speechSynthesis.getVoices() 列出,按 lang 过滤 |
| lang(语种) | 声明文本语种,影响选音与发音 | 中英文混排时按句切 lang 更自然 |
常见问题
浏览器自带文本转语音吗,需要后端吗?
现代浏览器内置 Web Speech API 的 SpeechSynthesis,纯前端就能朗读,不需要调任何后端接口,也不产生额外费用。缺点是可用的发音人依赖用户操作系统自带的声音,不同设备音色不一致。
SSML 在网页里都能用吗?
标准不一致。Chrome 桌面端较完整支持 <break>、<prosody> 等常用标签,但移动端和 Safari 支持零散,部分标签会被忽略。生产环境建议先用 feature 检测,不支持 SSML 时退化成纯文本朗读。
为什么有时候 getVoices() 返回空?
声音列表是异步加载的,页面刚打开时可能还没就绪。正确做法是监听 voiceschanged 事件再取,或在拿到非空列表后再初始化 UI,否则会选不到发音人。
长文本朗读会中断怎么办?
部分浏览器对单次 utterance 有长度或时长上限,超长文本会被截断。稳妥做法是按段落切分,监听 onend 后连续朗读下一段,并在边界处适当插入 <break> 让停顿自然。