SpeechSynthesisUtterance Chrome 问题答案

【问题标题】：SpeechSynthesisUtterance Chrome IssueSpeechSynthesisUtterance Chrome 问题
【发布时间】：2016-03-11 20:40:21
【问题描述】：

我在使用本机 SpeechSynthesisUtterance 时遇到问题（或错误）。我构建了一个基本函数“speak”，它将获取给定的字符串“text”并发音。

//Function for speaking text
function speak(text){
  if ('speechSynthesis' in window) {
    var sentence = new SpeechSynthesisUtterance();
    var voices = window.speechSynthesis.getVoices();
    for(var i = 0; i < voices.length; i++) {
          if(voices[i]['name'] == "Alex"){
            sentence.voice = voices[i];
          }
      }
    sentence.pitch = 0.5;
    sentence.rate = 1;
    sentence.text = text;
    window.speechSynthesis.speak(sentence);
  } else {
    console.log("Oops! Your browser does not support HTML SpeechSynthesis.")
  }
}

此功能在 Safari 中完美运行，选择语音“Alex”，然后以该语音发音给定文本。另一方面，在 Chrome 中，我遇到了一个问题。出于某种原因，只有在 Chrome 中第二次调用该函数时才会选择“Alex”。第一次调用该功能时使用默认的女声朗读文本，但之后语音设置为“Alex”并且效果很好。我已将此错误限制为 Chrome 问题，但是，我仍然希望修复它。非常感谢任何帮助！

【问题讨论】：

标签： javascript google-chrome text-to-speech speech-synthesis

【解决方案1】：

getVoices 是异步的（在规范勘误表中提到），你需要听voiceschanged event，推理有点令人沮丧但有道理，Voice 系统是延迟加载的，第一次调用 getVoices 会阻塞主线程，因此 android 上的第一次调用返回 0 结果，然后在语音可用时触发onvoiceschanged。

// Chrome loads voices asynchronously.
window.speechSynthesis.onvoiceschanged = function(e) {
  loadVoices();
};

linked demo 错误地设置了话语的 voice 属性。这不存在，相反，您需要更改 lang 和可选的 voiceURI 以更改默认使用的语音，如下所示和new demo。

if (voiceSelect.value) {
  var selectedVoice = speechSynthesis.getVoices().filter(function(voice) { return voice.voiceURI == voiceSelect.value; })[0];

  msg.voiceURI = selectedVoice.voiceURI;
  msg.lang = selectedVoice.lang;

}

【讨论】：