如何延迟合成在Mespeak.js显示单词，而wav播放

How to delay synthesise in Mespeak.js display words while wav plays

本文关键字：单词 显示 js 播放 wav Mespeak 何延迟 延迟      更新时间：2023-09-26

我正在编辑Mespeak.js，以帮助一位有视觉跟踪问题的朋友。

我一直在浏览Mespeak.js（http://www.masswerk.at/mespeak/)并试图弄清楚如何在说出每个单词时抓住它，然后在播放wav文件时将其显示在屏幕上。

我认为这与将数据作为数组返回，然后在wav播放时显示数组有关。我甚至不确定这是可能的（或者原始数据是什么样子的）。

这是我的

div id="display">
    <span>Here.</span>
</div>
<script type="text/javascript">
var timeoutID
var texttosend = prompt('Text to Split');
var res = texttosend.split(" ")
var arrayLength = res.length;
function refresh(word) {
    meSpeak.speak(res[i], {speed: 100});
    console.log(res[i]);
    $( "#display span" ).text(word);
    };
console.log('here');
for (var i = 0; i <= arrayLength; i++) {
        timoutID = window.setTimeout(refresh(res[i]), 50000+(i*50000));
};

这里有两个问题——我认为它们都与延误有关。无论我将timeoutID设置为什么，文本都会一次显示大小，并且唯一显示的单词是最后一个。我尝试过使用setTimeout的变体，也尝试过jQuery的延迟。有什么帮助的想法吗？console.log分别输出每个单词，所以我知道将文本分隔成数组是有效的，循环也是有效的——我认为现在只是计时。

很抱歉，如果这没有意义的话——我想一些澄清会帮助我开始解决这个问题。

Background:meSpeak.js将输入文本发送到嵌入式eSpeak，并提供渲染wav文件的选项。然后使用WebAudio API或Audio元素播放此waw-file。因此，无法判断当前播放的是连续话语的哪一部分（因为我们不知道一个单词何时开始或分别结束于音频流的哪个点）。但是，另一方面，我们可能知道一些事情，即流式音频的播放何时结束。也许，我们可以用这个？

为了解决这个问题，meSpeak.speak（）将回调函数作为可选的第三个参数，该参数将在话语回放完成后调用。（参见JS说唱演示，http://www.masswerk.at/mespeak/rap/，对于一个复杂的示例。）请注意，如果你用单个单词这样做，你会在一个场景中失去单词的任何上下文，因此你会失去话语/句子的任何旋律调节。此外，单词之间会有一个明显的延迟。

示例：

function speakWords(txt) {
  var words = txt.split(/'s+/);
  function speakNext() {
    if (words.length) {
      var word = words.shift();
      console.log('speaking: ' + word);
      meSpeak.speak(word, {}, speakNext);
    }
    else {
      console.log('done.');
    }
  }
  speakNext();
}

这里，内部函数"speakNext（）"从队列中移动下一个单词，记录它并调用meSpeak.speak（），将其本身作为回调（第三个参数）。因此，如果音频已经完成，将调用"speakNext（）"来处理下一个单词。如果队列最终是空的，我们将最终使用else子句。（你可能想用更复杂的显示器取代简单的日志记录。）

在进一步的优化步骤中，您可以首先渲染部分流（使用选项"rawdata"），然后播放它们（使用meSpeak.play（）），如：

function speakWords2(txt) {
  var i, words, streams = [];
  function playNext() {
    if (i < streams.length) {
      console.log('speaking: ' + words[i]);
      meSpeak.play(streams[i], 1, playNext);
      i++;
    }
    else {
      console.log('done.');
    }
  }
  // split utterance and pre-render single words to stream-data
  words = txt.split(/'s+/);
  for (i=0; i < words.length; i++)
      streams.push( meSpeak.speak(words[i], {rawdata: true}) );
  // now play the partial streams (words) in a callback-loop
  i=0;
  playNext();
}

这样，当函数被调用时，由渲染音频流引起的延迟将发生在单个块中，并且预渲染的音频流（针对每个单独的单词）将在没有任何进一步负载的情况下（在后台）被回放。不利的一面是，这将增加应用程序的内存占用，因为每个单词的所有高分辨率音频流都同时保存在数组"流"中。

相关文章：