【備忘録】ブラウザで音声認識する

ブラウザに内蔵のAPIで音声認識する場合。
パラメータで認識中の途中結果を取得したり、連続で認識するといった変更はあるけど、とりあえず日本語の設定のみ。

検証環境

• Google Chrome バージョン: 81.0.4044.138

ソースコード

html

<button id='start'>開始</button>

javascript

const start  = document.getElementById('start');

SpeechRecognition = webkitSpeechRecognition || SpeechRecognition;

const recognition = new SpeechRecognition();
recognition.lang = 'ja-JP';

recognition.onresult = (event) => {
  console.log(event.results[0][0].transcript);
}

start.onclick = (event) => {
  recognition.start();
};

チラシの裏（読まなくてもいい余談）

試してみると、結構正確に認識してくれます。音声の文書起こしをしたいときにわざわざ外部サービスを使わなくていいので便利です。
どちらかといえば、どんな局面で使うのか、を考える方が重要ですね。