为什么在页面加载时会触发 voiceschanged 事件？

Question

在 Chrome 中，voiceschanged 在页面加载时触发，所以我不需要调用具有speechSynthesis.getVoices() 的函数，只要我有一个事件，我的空数组就会被声音填充当voiceschanged 被触发时调用它的监听器。

// Store voices
let voices = [];

function getVoices() {
  voices = speechSynthesis.getVoices();

  // Create an option for each voice in array
  voices.forEach((voice) => {
    const option = document.createElement('option');

    option.value = voice.name;
    option.innerText = `${voice.name} ${voice.lang}`;

    voicesSelect.appendChild(option);
  });
}

// Voices changed
speechSynthesis.addEventListener('voiceschanged', getVoices);

// Not needed (in Chrome at least) because voiceschanged event fires on page load, calling getVoices due to event listener (trying to figure out why)
// getVoices();

我只是想了解这种行为 - 据我所知，MDN 的 explanation 何时发声并没有解释它：

Web Speech API 的 voiceschanged 事件在列表时触发 SpeechSynthesisVoice 对象将由 SpeechSynthesis.getVoices() 方法已更改（当 voiceschanged 事件触发。）

Answer 1

该事件会触发，因为当 Chrome 完成 API 调用以获取仅对 Chrome 用户可用的语音列表时，语音列表会发生变化。证明：

• 如果我通过 Internet 连接加载基于 Speech Synthesis API 的 Web 应用程序，我有 21 个可用的声音，几个月前，我只记得 10 或 15 个左右。
• 如果我也这样做，在没有 Internet 连接的情况下，我只有两种声音：Microsoft David Desktop 和 Microsoft Zira Desktop。

您可能会注意到，没有互联网连接的两个声音相当无聊，几乎可以识别用于廉价音频制作。但是谷歌浏览器是流畅的，几乎是屈折的。当然，这个事件必须在声音加载时触发。快速浏览W3C Errata in the Web Speech API Specification。任何时候加载声音时，都会触发 voiceschanged 事件....

voiceschanged：当 getVoices 方法将返回的 SpeechSynthesisVoiceList 的内容发生变化时触发。示例包括：异步确定列表的服务器端合成，或安装/卸载客户端语音时。

事实上，看看你链接的MDN web docs的最后一行...

但是，对于 Chrome，您必须等待事件触发才能填充列表，因此底部的 if 语句如下所示。

Speech Synthesis API-Based Source Code（来自我的开源项目 PronounceThat）