web-dev-qa-db-ja.com

SpeechSynthesis API onendコールバックが機能しない

私は Speech Synthesis API on Googleを使用していますChromev34.0.1847.131。APIはChromeで始まるv33。

音声合成は、onendにコールバックを割り当てる場合を除いて、ほとんどの部分で機能します。たとえば、次のコード:

var message = window.SpeechSynthesisUtterance("Hello world!");
message.onend = function(event) {
    console.log('Finished in ' + event.elapsedTime + ' seconds.');
};
window.speechSynthesis.speak(message);

onendを呼び出すこともあれば、呼び出さないこともあります。タイミングが完全にずれているようです。呼び出された場合、出力されるelapsedTimeは常に1399237888のようなエポック時間になります。

29
huu

これは私がそれを機能させるために見つけた方法ですが、これが正しい動作であるかどうかはわかりません...

最初に、speak関数をすぐに呼び出さないでください。コールバックを使用してください。

2番目に、時間を取得するには、timeStampの代わりにelapsedTimeを使用します。 performance.now()を使用することもできます。

var btn = document.getElementById('btn');
speechSynthesis.cancel()
var u = new SpeechSynthesisUtterance();
u.text = "This text was changed from the original demo.";

var t;
u.onstart = function (event) {
    t = event.timeStamp;
    console.log(t);
};

u.onend = function (event) {
    t = event.timeStamp - t;
    console.log(event.timeStamp);
    console.log((t / 1000) + " seconds");
};

btn.onclick = function () {speechSynthesis.speak(u);};

デモ: http://jsfiddle.net/QYw6b/2/

あなたは時間が経過し、両方のイベントが確実に発生します。

9
Muhammad Umer

Kevin Hakansonの 回答 で言及されているバグについて このコメント によると、ガベージコレクションに問題がある可能性があります。 speakを呼び出す前に変数に発話を保存する トリックを行うように思われる

window.utterances = [];
var utterance = new SpeechSynthesisUtterance( 'hello' );
utterances.Push( utterance );
speechSynthesis.speak( utterance );
20
techpeace

SpeakerListenerの場合と同様に、開始と終了にEventListenerを使用できます(http://www.speakerbot.de/ )。

ここで、言葉が話されている間、私の顔が変わります。

newUtt = new SpeechSynthesisUtterance();

newUtt.addEventListener('start', function () {
     console.log('started');
})

newUtt.addEventListener('end', function () {
     console.log('stopped');
})
4
fimbim

ここで提案されている両方の解決策が 先ほど書いたアプリ で機能しないことがわかりました。私が思いつくことができる唯一の解決策は、(一種の)忙しい待機です:

function speak( text, onend ) {
  window.speechSynthesis.cancel();
  var ssu = new SpeechSynthesisUtterance( text );
  window.speechSynthesis.speak( ssu );
  function _wait() {
    if ( ! window.speechSynthesis.speaking ) {
      onend();
      return;
    }
    window.setTimeout( _wait, 200 );
  }
  _wait();
}

完全な例は this codepen にあります

3
Mapio

これは、2015年7月12日に報告されたChromiumのバグに似ています。

問題 509488 :Web Speech API:SpeechSynthesisUtteranceオブジェクトの「end」イベントがディスパッチされないことがある

3
Kevin Hakanson

話す前に発話を印刷してみてください...コンソールを削除すると、この問題が発生します。理由はわかりません

console.log("utterance", utterThis);
synth.speak(utterThis);
1
yun

また、この作業を確実に行う唯一の方法は、.canceを使用することです。 17秒のタイムアウトを使用します。私の録音はすべて20秒未満なので、これでうまくいきます。

utterance.onstart = function (event) {
setTimeout(function(){window.speechSynthesis.cancel();},17000);
};

私がこの問題に遭遇する前に、それが試みた8-10メッセージごとに。 .cancelを追加すると、常に機能するようです。また、呼び出し時にset timeoutを呼び出します。

setTimeout(function(){window.speechSynthesis.speak(utterance);},100);
0
Bruce Allen