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()
相同。