Vosk-Browser：ブラウザ上で動作する音声認識ツール

vosk-browserはブラウザ上で動作する音声認識ツールで、WebAssembly技術に基づいて構築され、Vosk音声認識ライブラリを使用しています。マイク入力や音声ファイルをブラウザで直接処理することができ、クラウドサーバーに依存しないオフラインの音声テキスト変換機能を提供します。このツールは、英語、ドイツ語、フランス語、スペイン語など13言語をサポートしており、ブラウザに音声認識を実装する必要がある開発者に適しています。vosk-browserはWebWorkerを介して実行されるため、パフォーマンスが最適化され、メインブラウザのスレッドがブロックされることがありません。ユーザーはモデルをロードし、シンプルなJavaScriptコードで音声認識を開始できるため、チャットボット、スマートホーム、字幕生成などのシナリオに適している。Ciaran O'Reillyによって開発されたこのプロジェクトはGitHubでホストされており、450以上のスターと活発なコミュニティを持っている。

機能一覧

• オフライン音声認識インターネットに接続することなく、ブラウザ上で音声入力を処理し、ユーザーのプライバシーを保護します。
• 多言語サポート英語、ドイツ語、フランス語、スペイン語、その他13ヶ国語に対応しており、モデルも拡張可能です。
• マイクおよびオーディオファイル入力ライブマイク入力やアップロードされたオーディオファイルを処理することができます。
• WebAssemblyの最適化: WebAssemblyとWebWorkerを通して実行され、効率的でブラウザをブロックしないことを保証します。
• シンプルな統合: CDNまたはnpm経由でのインストール、ウェブページの迅速な埋め込みをサポートします。
• リアルタイム結果出力リアルタイムかつ部分的な認識結果を提供し、動的なインタラクションシナリオに適しています。
• 柔軟なモデルローディング圧縮されたフォーマットで保存され、サイズが小さい。

ヘルプの使用

設置プロセス

vosk-browserは非常に使いやすく、開発者は以下の方法でウェブページに組み込むことができます：

1. CDN経由で導入::
   次のコードをHTMLファイルに追加して、vosk-browserライブラリをページにロードします：

   <script type="application/javascript" src="https://cdn.jsdelivr.net/npm/vosk-browser@0.0.5/dist/vosk.js"></script>
   

   ロード後Vosk JavaScriptでグローバル変数が使える。最新バージョンは0.0.8です。最新バージョンはnpmかjsDelivrで確認することをお勧めします。

2. npm経由でインストールする::
   モジュール開発を使用している場合は、npm経由でインストールできる：

   npm install vosk-browser
   

   そして、それをJavaScriptファイルにインポートする：

   import * as Vosk from 'vosk-browser';
   

3. 言語モデルのダウンロード::
   vosk-browserは言語モデルファイルを読み込む必要があります。 .tar.gz例えば vosk-model-small-en-us-0.15.tar.gz.これらのモデルは、公式に提供されているリンクからダウンロードすることができます（例えば、以下のようなものです）。 https://ccoreilly.github.io/vosk-browser/models/)をダウンロードします。モデルファイルには、以下のような音声認識に必要な設定ファイルやデータが含まれています。 mfcc.conf 歌で応える model.conf.高精度モデルの場合 mfcc_hires.conf.モデルファイルをスクリプトと同じパスに配置するか、モデルの URL を指定します。

使用手順

以下は、vosk-browserを使用して音声認識を実装するための詳細な手順です：

1. 積載モデル::
   利用する Vosk.Model コンストラクタはモデルをロードする。モデルファイルが model.tar.gzコードは以下の通り：

   async function loadModel() {
   const model = await Vosk.createModel('model.tar.gz');
   return model;
   }
   

   モデルの読み込みには、ファイルサイズやネットワークの速度によって数秒かかる場合があります。読み込み速度を向上させるために、小さなモデル（例えば50MB）を使用することをお勧めします。

2. 認識器の初期化::
   レコグナイザーを作成し、サンプルレートを指定します（通常はオーディオコンテキストに合わせて、16000Hzなど）：

   async function startRecognition(model) {
   const ctx = new AudioContext();
   const recognizer = await Vosk.createRecognizer(model, ctx.sampleRate);
   return { recognizer, ctx };
   }
   

3. マイク入力のキャプチャ::
   ブラウザの navigator.mediaDevices.getUserMedia マイク入力を取得します：

   async function setupMic(ctx) {
   const stream = await navigator.mediaDevices.getUserMedia({ audio: true });
   const micNode = ctx.createMediaStreamSource(stream);
   return micNode;
   }
   

4. 識別結果の処理::
   モニター result 歌で応える partialResult イベントを使用して、完全または部分的な認識結果を得る：

   recognizer.addEventListener('result', (ev) => {
   console.log('完整结果:', ev.detail.text);
   });
   recognizer.addEventListener('partialResult', (ev) => {
   console.log('部分结果:', ev.detail.text);
   });
   

5. オーディオデータの送信::
   マイクの音声データをレコグナイザに送信します：

   async function connectAudio(ctx, micNode, recognizer) {
   const transferer = await Vosk.createTransferer(ctx, 128 * 150);
   transferer.port.onmessage = (ev) => recognizer.acceptWaveform(ev.data);
   micNode.connect(transferer);
   }
   

6. アクティベート認識::
   上記の手順を組み合わせて、音声認識を開始します：

   async function start() {
   const model = await loadModel();
   const { recognizer, ctx } = await startRecognition(model);
   const micNode = await setupMic(ctx);
   await connectAudio(ctx, micNode, recognizer);
   }
   document.getElementById('startButton').onclick = start;
   

注目の機能操作

• リアルタイム認識スルー partialResult イベントでは、開発者はユーザーが話している間にリアルタイムで部分的な認識結果を得ることができ、チャットボットやリアルタイムのキャプションシナリオに適している。
• 多言語切り替えモデルファイルを置き換えるだけです。 vosk-model-fr-0.22.tar.gz (フランス語に切り替え）を使えば、コードを修正することなく他の言語をサポートすることができる。
• オフライン操作すべての処理は、サーバーのサポートなしにブラウザ内でローカルに行われるため、プライバシーに配慮したシナリオに適しています。
• イベント管理イベント・リスナーの動的な追加と削除をサポート。例えば、結果リスナーの削除など：

  recognizer.removeEventListener('result', callbackFunction);
  

  これは、Vue.jsアプリケーションのような動的インターフェイスで役立つ。

ほら

• モデルの選択小さなモデルは高速ローディングに適しているが、精度は低い。 rescore モデル）はより正確だが、より多くのメモリを必要とする。
• ブラウザの互換性ブラウザがWebAssemblyとWeb Audio APIをサポートしていることを確認してください（例：Chrome、Firefox）。
• パフォーマンス最適化しかし、モデルのロード時間が長くなる可能性があることに注意し、モデルを事前にロードすることをお勧めします。

アプリケーションシナリオ

1. チャットボット
   開発者はvosk-browserをウェブチャットボットに統合することで、マイク入力による音声対話が可能になり、オンラインカスタマーサービスやバーチャルアシスタントに適しています。
2. サブタイトル・ジェネレーション
   音声ファイルをアップロードした後、vosk-browserはビデオコンテンツクリエイターや教育プラットフォーム向けに字幕を生成します。
3. スマート・ホーム・コントロール
   ブラウザで音声コマンドを認識し、照明のオン・オフや温度調整など、スマートデバイスの操作が可能になる。
4. 語学学習ツール
   生徒はマイクを通して発音の練習をすることができ、vosk-browserが発音のテキストにリアルタイムでフィードバックを提供するので、スピーキングの上達に役立ちます。

品質保証

1. vosk-browserはインターネットに接続する必要がありますか？
   vosk-browserは完全なオフライン操作をサポートし、ネットワークがない環境ではモデリングと処理をローカルで行います。
2. 対応言語は？
   現在、英語、ドイツ語、フランス語、スペイン語など13カ国語に対応しており、将来的には新機種によって対応言語を増やすことも可能だ。
3. どうすれば認識精度を向上させることができるのか？
   高精度のモデルを使う（例えば rescore モデル）を使用し、マイクが良質であることを確認してください。モデルの model.conf ファイル内のデコード・パラメーターは、結果を最適化することもできる。
4. なぜ認知が遅れるのか？
   遅延は、モデルの読み込み時間やハードウェアの性能に起因する場合があります。より小さなモデルを使用するか、ブラウザのパフォーマンスを最適化することをお勧めします。