javascript - 说出数组中的单词

Question

我想用 Web Speech API 大声说出一系列单词.

单词是一、二、三、四、五。

当在 Chrome 上说出单词时，下面的脚本说出第一个单词，然后重复最后一个单词，直到迭代完成，语音输出为:

one, five, five, five, five.

在 Firefox 上，脚本说出第一个词然后停止，语音输出为:

one.

我已经将事情记录到控制台以试图弄清楚发生了什么，这是两种浏览器的结果。

word: one
message: one 
word: two 
message: two 
word: three 
message: three 
word: four 
message: four 
word: five 
message: five

控制台的输出是所需的语音输出，所以我不确定到底发生了什么。

var msg = new SpeechSynthesisUtterance();
var words = ['one', 'two', 'three', 'four', 'five'];

for (var i = 0; i < words.length; i++) {
    msg.text = words[i];

    console.log('word: ' + words[i]);
    console.log('message: ' + msg.text);

    window.speechSynthesis.speak(msg);
}

可能是什么原因造成的，我该如何纠正？

Answer 1

您每次都需要使用一个新的SpeechSynthesisUtterance 实例。

var words = ['one', 'two', 'three', 'four', 'five'];

for (var i = 0; i < words.length; i++) {
    var msg = new SpeechSynthesisUtterance();
    msg.text = words[i];

    console.log('word: ' + words[i]);
    console.log('message: ' + msg.text);

    window.speechSynthesis.speak(msg);
}

语音未在零时间播放，并且后续的 SpeechSynthesisUtterance 实例似乎被放置在队列中，直到上一个语音播放完毕。您重复使用同一个实例，在它们被 speak(...) 排队之后但在它们被从队列中弹出并读取之前修改值。第一个话语(“one”)被正确播放，因为队列中没有其他东西可以阻止它(它被立即读取)，但其余的需要等待，并在被读取之前被修改。