SpeechSynthesis - 表示语音服务的控制器接口
这是一个实验中的功能
此功能某些浏览器尚在开发中,请参考浏览器兼容性表格以得到在不同浏览器中适合使用的前缀。由于该功能对应的标准文档可能被重新修订,所以在未来版本的浏览器中该功能的语法和行为可能随之改变。
SpeechSynthesis 是 Web Speech API 的接口,表示语音服务的控制器接口;它可用于检索有关设备上可用的合成语音,开始和暂停语音以及其他命令的信息。
属性
SpeechSynthesis 还从其父接口 EventTarget 继承了属性。
SpeechSynthesis.paused 只读
一个 Boolean,如果 SpeechSynthesis 对象处于暂停状态,则返回 true。
SpeechSynthesis.pending 只读
一个 Boolean,如果语音队列中包含尚未发出的语音,则返回 true。
SpeechSynthesis.speaking 只读
一个 Boolean,如果当前正在发声,会返回 true(即使 SpeechSynthesis 处于暂停状态)。
方法
SpeechSynthesis 还从其父接口 EventTarget 继承了方法。
SpeechSynthesis.cancel()
从语音队列中删除所有语音。
SpeechSynthesis.getVoices()
返回 SpeechSynthesisVoice 对象的列表,这些对象表示当前设备上的所有可用语音。
SpeechSynthesis.pause()
将 SpeechSynthesis 对象更改为暂停状态。
SpeechSynthesis.resume()
将 SpeechSynthesis 对象更改为非暂停状态:如果已经暂停,则恢复它。
SpeechSynthesis.speak()
将 utterance 添加到语音队列中;在说完其他语音之后,就会将其说出来。
事件
使用 addEventListener() 或通过为此接口的 oneventname 属性分配事件监听器来监听这些事件
voiceschanged
当 SpeechSynthesisVoice 方法将返回的 SpeechSynthesisVoice 对象列表更改时触发。也可以通过 onvoiceschanged 属性处理。
实例
在基本的语音合成器实例中,我们首先使用 window.speechSynthesis 来获取对 SpeechSynthesis 控制器的引用。定义了一些必要的变量后,我们使用 SpeechSynthesis.getVoices() 检索可用的语音列表,并使用它们填充到选择菜单,以便用户可以选择所需的语音。
在 inputForm.onsubmit 处理程序中,我们使用 preventDefault() 来停止提交表单;创建一个新的 SpeechSynthesisUtterance 实例,其中包含来自 <input> 的文本;将语音的声音设置为在 <select> 元素中;然后通过 SpeechSynthesis.speak() 方法开始发出声音。
var synth = window.speechSynthesis;
var inputForm = document.querySelector('form');
var inputTxt = document.querySelector('.txt');
var voiceSelect = document.querySelector('select');
var pitch = document.querySelector('#pitch');
var pitchValue = document.querySelector('.pitch-value');
var rate = document.querySelector('#rate');
var rateValue = document.querySelector('.rate-value');
var voices = [];
function populateVoiceList() {
voices = synth.getVoices();
for(i = 0; i < voices.length ; i++) {
var option = document.createElement('option');
option.textContent = voices[i].name + ' (' + voices[i].lang + ')';
if(voices[i].default) {
option.textContent += ' -- DEFAULT';
}
option.setAttribute('data-lang', voices[i].lang);
option.setAttribute('data-name', voices[i].name);
voiceSelect.appendChild(option);
}
}
populateVoiceList();
if (speechSynthesis.onvoiceschanged !== undefined) {
speechSynthesis.onvoiceschanged = populateVoiceList;
}
inputForm.onsubmit = function(event) {
event.preventDefault();
var utterThis = new SpeechSynthesisUtterance(inputTxt.value);
var selectedOption = voiceSelect.selectedOptions[0].getAttribute('data-name');
for(i = 0; i < voices.length ; i++) {
if(voices[i].name === selectedOption) {
utterThis.voice = voices[i];
}
}
utterThis.pitch = pitch.value;
utterThis.rate = rate.value;
synth.speak(utterThis);
inputTxt.blur();
}
规范
| 规范 | 状态 | 备注 |
|---|---|---|
| Web Speech API SpeechSynthesis 的定义 |
草稿 | - |
桌面浏览器兼容性
| 特性 | Chrome | Edge | Firefox | Internet Explorer | Opera | Safari |
|---|---|---|---|---|---|---|
| 基础支持 | 33 | ≤18 | 49 | 不支持 | 21 | 7 |
cancel | 33 | 14 | 49 | 不支持 | 21 | 7 |
getVoices | 33 | 14 | 49 | 不支持 | 21 | 7 |
onvoiceschanged | 33 | 14 | 49 | 不支持 | 不支持 | 不支持 |
pause | 33 | 14 | 49 | 不支持 | 21 | 7 |
paused | 33 | 14 | 49 | 不支持 | 21 | 7 |
pending | 33 | 14 | 49 | 不支持 | 21 | 7 |
resume | 33 | 14 | 49 | 不支持 | 21 | 7 |
speak | 33 | 14 | 49 | 不支持 | 21 | 7 |
speaking | 33 | 14 | 49 | 不支持 | 21 | 7 |
voiceschanged 事件 | 33 | 14 | 49 | 不支持 | 21 | 7 |
移动浏览器兼容性
| 特性 | Android | Chrome for Android | Edge mobile | Firefox for Android | IE mobile | Opera Android | iOS Safari |
|---|---|---|---|---|---|---|---|
| 基础支持 | 4.4.3 | 33 | 未知 | 62 61 — 62 | 未知 | 不支持 | 7 |
cancel | 4.4.3 | 33 | 未知 | 62 61 — 62 | 未知 | 不支持 | 7 |
getVoices | 4.4.3 | 33 | 未知 | 62 61 — 62 | 未知 | 不支持 | 7 |
onvoiceschanged | 4.4.3 | 33 | 未知 | 62 61 — 62 | 未知 | 不支持 | 不支持 |
pause | 4.4.31 | 331 | 未知 | 621 61 — 621 | 未知 | 不支持 | 7 |
paused | 4.4.3 | 33 | 未知 | 62 61 — 62 | 未知 | 不支持 | 7 |
pending | 4.4.3 | 33 | 未知 | 62 61 — 62 | 未知 | 不支持 | 7 |
resume | 4.4.3 | 33 | 未知 | 62 61 — 62 | 未知 | 不支持 | 7 |
speak | 4.4.3 | 33 | 未知 | 62 61 — 62 | 未知 | 不支持 | 7 |
speaking | 4.4.3 | 33 | 未知 | 62 61 — 62 | 未知 | 不支持 | 7 |
voiceschanged 事件 | 4.4.3 | 33 | 未知 | 62 61 — 62 | 未知 | 不支持 | 7 |
1. 在 Android 中,pause() 结束当前的发声。 pause() 的行为与 cancel() 相同。