Skip to content

【入門サンプル】Web Speech API を使ってブラウザと音声でやり取りする

Web Speech API を使うと、ブラウザでも Siri や Cortana のように音声でやり取りができるということだったので、試しに使ってみました。

Siri や Cortana のようにといっても音声面のみで、アシスタント機能は実装していません。言われたことをオウム返しするだけです。

Web Speech API

利用する Web API は次の2つです。

Speech recognition

大雑把に説明すると、我々の音声をブラウザが ”聞く” ための API です。

マイクからの入力をテキストとして取得することができます。

https://developer.mozilla.org/ja/docs/Web/API/SpeechRecognition

Speech synthesis

こちらも大雑把に説明すると、ブラウザが ”話す” ための API です。

スピーカーを通じてテキストを読み上げることができます。

https://developer.mozilla.org/ja/docs/Web/API/SpeechSynthesisUtterance

オウム返しプログラム

実際に作ってみました。

ちなみに Speech synthesis で読み上げているときに Speech recognition をオンにしていると、スピーカーからの音声をマイクが拾ってしまい、「話す」→「聞く」→「話す」→「聞く」…の無限ループに陥ってしまうので注意が必要です。

マイクからの入力をスピーカーから出力してオウム返しするプログラムの完成です。

ただしオウム返しといっても一度テキストに変換しているので、「昨日(さくじつ)」「昨日(きのう)」のように複数の読み方がある単語が含まれたときには、そのままにはならないことがあります。

また今回は input をほぼそのまま return するように作成した makeResponse 関数ですが、チューニングしていくことで会話をしているような挙動を実装することも可能です。

たとえば「時間を教えて」に対して現在時刻を返すように実装することができるでしょう。

さらに、人工知能や人口無能と連携すれば、Siri や Cortana のような役目を果たす Web アプリを実装することもできそうです。

Comments are closed.