マイク

【JavaScript】VoskJsで音声ファイルを音声認識する。

音声認識の技術は、スマートスピーカーや音声入力のアプリケーション、さらには自動字幕生成などさまざまな分野で活躍しています。そんな中、Vosk.js は Web ブラウザ上で動作する軽量な音声認識ライブラリとして注目されています。この記事では、Vosk.js を使って音声ファイルから音声認識を行うサンプルコードを解説していきます。 ファイル認識開始 部分結果： 最終結果： 1. Vosk.js とはVosk 音声認識エンジンのブラウザ向け実装 Vosk.js は、Vosk 音声認識エンジンのブラウザ向け実装です。WebAssembly を活用しているため、クライアントサイドで高速かつ低リソースで音声認識を行うことが可能です。Web アプリケーションに組み込むことで、サーバーに音声データを送信する必要がなく、プライバシー保護や低遅延を実現できる点が大きなメリットとなっています。 Vosk.js の特徴としては、以下の点が挙げられます： 2. Vosk.js ライブラリの読み込み HTML 内部では、CDN 経由で Vosk.js ライブラリを読み込んでいます。 この記述により、外部ホストから最新の Vosk.js ライブラリが取得され、音声認識機能が利用可能となります。CDN を利用することで、ローカルにライブラリを配置する手間が省けるとともに、キャッシュなどの効果により読み込み速度が向上するメリットがあります。 3. モデルのロードと初期化 まず最初に行うのは、音声認識用のモデルを読み込む処理です。モデルは ZIP ファイルとして提供され、Vosk.createModel を使って非同期にロードされます。 4. ファイル認識の開始処理 ユーザーがファイル選択後に認識開始ボタンを押すと、startFileRecognition 関数が実行され、音声ファイルの処理が始まります。 4.1. ファイル入力の確認 4.2. FileReader によるファイルの読み込み 4.3. AudioContext と AudioBuffer の利用 これにより、ブラウザ内で音声データの再生、加工、解析が可能となります。 4.4. 認識器（Recognizer）の生成 サンプルレートを正しく設定することは、音声認識の精度に大きく影響するため、必須の処理となります。 4.5. 部分結果と最終結果のイベント設定 このイベントハンドラにより、音声認識の進行状況をユーザーにフィードバックできます。 認識結果は新しい <p> 要素に追加され、複数回の認識結果も順次表示できるようになっています。 4.6. 音声データのチャンク投入 この方法により、ストリーミングのように音声データが認識器に送信され、内部で処理が行われます。 4.7. 無音バッファ投入による入力終了の通知 ファイル認識の場合、マイク入力と異なり入力の終了を認識器に通知する必要があります。ここでは、一定期間の無音データを投入することで、認識器に「入力が終了した」というシグナルを送ります。 これにより、認識器はバッファ内の全データを処理し、最終的な結果を出力できるようになります。 5. 付録 5.1 マイク入力による音声認識 5.2 マイク入力による音声認識（AudioWorklet版）