私は 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
のようなエポック時間になります。
これは私がそれを機能させるために見つけた方法ですが、これが正しい動作であるかどうかはわかりません...
最初に、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/
あなたは時間が経過し、両方のイベントが確実に発生します。
Kevin Hakansonの 回答 で言及されているバグについて このコメント によると、ガベージコレクションに問題がある可能性があります。 speak
を呼び出す前に変数に発話を保存する トリックを行うように思われる :
window.utterances = [];
var utterance = new SpeechSynthesisUtterance( 'hello' );
utterances.Push( utterance );
speechSynthesis.speak( utterance );
SpeakerListenerの場合と同様に、開始と終了にEventListenerを使用できます(http://www.speakerbot.de/ )。
ここで、言葉が話されている間、私の顔が変わります。
newUtt = new SpeechSynthesisUtterance();
newUtt.addEventListener('start', function () {
console.log('started');
})
newUtt.addEventListener('end', function () {
console.log('stopped');
})
ここで提案されている両方の解決策が 先ほど書いたアプリ で機能しないことがわかりました。私が思いつくことができる唯一の解決策は、(一種の)忙しい待機です:
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 にあります
これは、2015年7月12日に報告されたChromiumのバグに似ています。
問題 509488 :Web Speech API:SpeechSynthesisUtteranceオブジェクトの「end」イベントがディスパッチされないことがある
話す前に発話を印刷してみてください...コンソールを削除すると、この問題が発生します。理由はわかりません
console.log("utterance", utterThis);
synth.speak(utterThis);
また、この作業を確実に行う唯一の方法は、.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);