SpeechRecognition API を使用して音声をテキストに変換する

SpeechRecognition API は、メディア ファイルやデバイスのマイクなどのオーディオ ソースの音声を、Web サイトやブラウザー拡張機能の JavaScript コードから直接テキストに変換できる標準の Web API です。 この記事では、Microsoft Edge に組み込まれているデバイス上 (またはローカル) の音声認識モデルで SpeechRecognition API を使用する方法について説明します。

API の詳細については、MDN の「 Web Speech API」を参照してください。

詳細な内容:

ローカル音声認識モデルの使用可能性

ローカル音声認識モデルは、Microsoft Edge Canary または Dev (バージョン 150.0.4076 以降) で使用できます。 「Microsoft Edge Insider になる」を参照してください。

ローカル音声認識モデルの利点

Microsoft Edge のローカル モデルで SpeechRecognition API を使用すると、音声認識は音声がキャプチャされたのと同じデバイスで行われます。 この方法には、クラウドベースのソリューションと比較して次の利点があります。

  • コストの削減: クラウド認識サービスの使用にかかる費用はかかりません。

  • ネットワークの独立性: 最初のモデルのダウンロード以外に、この API を使用して音声を変換するときにネットワーク待機時間はなく、デバイスがオフラインのときにもこの API を使用できます。

  • プライバシーの改善: モデルに入力された音声はデバイスから出ることはなく、AI モデルのトレーニングのために収集されることもありません。

モデルの可用性

Web サイトで SpeechRecognition API でローカル音声認識モデルを初めて使用する場合は、モデルの初回ダウンロードが必要です。

SpeechRecognition API install() メソッドによって返される Promise を使用して、モデルのダウンロードを監視できます。 以下の「 ローカル モデルが既にインストールされているかどうかを確認する」を参照してください。

Microsoft Edge でローカル音声認識を有効にする

SpeechRecognition API でローカル音声認識モデルを使用するには、Microsoft Edge Canary または Dev でこの機能を有効にする必要があります。 デバイス上モデルを使用して音声認識を有効にするには:

  1. Microsoft Edge Canary または Dev (バージョン 150.0.4076 以降) を使用していることを確認します。 「Microsoft Edge Insider になる」を参照してください。

  2. Microsoft Edge Canary または Dev で、新しいタブまたはウィンドウを開き、edge://flags に移動します。

  3. ページ上部の検索ボックスに「 デバイス上のモデルで音声認識」と入力します。

  4. [ デバイス上のモデルでの音声認識] ドロップダウン リストで、[ 有効] を選択し、右下にある [ 再起動 ] ボタンをクリックします。

    ブラウザーのフラグ ページ

動作する例を見る

SpeechRecognition API の動作を確認し、デモ コードを確認するには:

  1. 上記のように、Microsoft Edge でローカル音声認識を有効にします。

  2. Microsoft Edge Canary または Dev で、タブまたはウィンドウを開き、 SpeechRecognition API プレイグラウンドに移動します。

  3. 上部の情報バナーで、状態をチェックします。最初は "SpeechRecognition API の準備完了" と表示されます。[開始] をクリックして開始します。

  4. [ 入力言語] ドロップダウン リストで、音声認識に使用する言語を選択します。

  5. [ オーディオ ソース] ドロップダウン リストで、音声認識用のオーディオ ソースを選択します。

    • デバイスのマイクをオーディオ ソースとして使用するには、[ マイク] を選択します。
    • [ ファイル ] を選択して、デバイスのオーディオ ファイルまたはビデオ ファイルをオーディオ ソースとして使用します。
  6. オーディオ ソースとして [ファイル ] を選択した場合は、[ メディア ファイル ] セクションが表示されます。 [ ファイルを選択 ] ボタンをクリックしてから、デバイスからオーディオ ファイルまたはビデオ ファイルを選択します。

  7. [スタート] ボタンをクリックします。

    選択した言語のローカル音声認識モデルをまだダウンロードしていない場合は、ダウンロードが開始され、情報バナーに「 en-US のデバイス上のモデルをインストールしています...」と表示されます。

    デバイス上の音声認識モデルのインストール

    モデルがインストールされると、テキスト トランスクリプションがページに表示されます。

    音声からテキストへの変換

  8. 音声からテキストへの変換を停止するには、[ 停止 ] ボタンをクリックします。

    また、入力オーディオが長時間無音の後に文字起こしが自動的に停止する場合もあります。

関連項目:

Web サイトでローカル認識で SpeechRecognition API を使用する

次のセクションでは、Web サイトのコードでローカル音声認識と共に SpeechRecognition API を使用する方法について説明します。 API 自体の詳細については、MDN の「 Web Speech API」を参照してください。

API がサポートされているかどうかを確認し、SpeechRecognition オブジェクトをインスタンス化します

SpeechRecognition API がブラウザーでサポートされていることを確認するには、 SpeechRecognition オブジェクトが使用可能かどうかをテストします。

if (!window.SpeechRecognition) {
  console.log("The SpeechRecognition API is not available in this browser.");
} else {
  console.log("The SpeechRecognition API is available.");
}

API がサポートされている場合は、新しい SpeechRecognition インスタンスを作成して API の使用を開始します。

const recognition = new SpeechRecognition();

関連項目:

入力言語を選択し、ローカル認識にオプトインする

ローカル モデルを使用して音声認識を構成するには、入力言語を指定し、 processLocally オプションを設定します。

recognition.lang = "en-US";
recognition.processLocally = true;

ローカル音声認識では、次の入力言語がサポートされています。

  • 英語 (en-US)
  • ドイツ語 (de-DE)
  • イタリア語 (it-IT)
  • ポルトガル語 (pt-PT)
  • スペイン語 (es-ES)
  • 韓国語 (ko-KR)

言語サポートは、将来のバージョンで拡張される予定です。

また、[ continuous ] と [ interimResults ] オプションを [ true ] に設定して、長いオーディオ セッションを停止せずに文字起こしし、中間結果を受け取ります。

recognition.continuous = true;
recognition.interimResults = true;

関連項目:

ローカル モデルが既にインストールされているかどうかを確認する

認識を開始する前に、SpeechRecognition.available() メソッドを使用して、選択した言語でローカル モデルが使用できるかどうかをチェックします。

モデルがまだインストールされていない場合は、 SpeechRecognition.install() メソッドを使用してインストールをトリガーし、モデルが完了するのを待ってから認識を開始します。

async function ensureModelReady(lang) {
  // Check if the model is already available.
  const availability = await SpeechRecognition.available({
    langs: [lang],
    processLocally: true,
  });

  // If the model is already available, proceed to recognition.
  if (availability === "available") {
    return true;
  }

  // If the model is not available but can be downloaded,
  // trigger the installation and wait for it to complete
  // before proceeding to recognition.
  if (availability === "downloadable" || availability === "downloading") {
    const installed = await SpeechRecognition.install({
      langs: [lang],
      processLocally: true,
    });

    if (!installed) {
      throw new Error(`Failed to install local model for ${lang}.`);
    }

    return true;
  }

   return false;
}

SpeechRecognition.install() によって返される Promise は、インストールが成功または失敗したときに解決されます。

関連項目:

音声認識の開始

API とモデルの両方の準備が整っていることを確認したら、認識を開始するには、 start() メソッドを使用します。

パラメーターを指定せずに呼び出された場合、 start() メソッドはユーザーのマイクからの音声を認識します。

recognition.start();

ユーザーのマイクではなくメディア ファイルからのオーディオを認識するには、引数として MediaStreamTrack インスタンスを start() メソッドに渡します。 たとえば、WebAudio API を使用して MediaStreamDestinationNode インスタンスを作成することにより、MediaStreamTrack インスタンスを作成できます。

const audioContext = new AudioContext();
const mediaStreamDestination = audioContext.createMediaStreamDestination();
recognition.start(mediaStreamDestination.stream.getAudioTracks()[0]);

関連項目:

メディア側で明示的に認識を停止する

認識を停止するには、 stop() メソッドを使用します。

recognition.stop();

また、入力として使用するメディア要素の onended イベント ハンドラーを使用して、メディア入力が終了したときに認識を停止することもできます。 たとえば、オーディオ ソースとして HTMLAudioElement または HTMLVideoElement を使用している場合は、次のようにイベント ハンドラーを設定できます。

mediaElement.onended = () => recognition.stop();

関連項目:

フィードバックの送信

以下に関するフィードバックをお待ちしております。

  • ローカル音声認識モデル。
  • ローカル音声認識モデルのパフォーマンス。
  • ユース ケースで確認したいその他の改善。

SpeechRecognition API のフィードバック問題にコメントを追加して、フィードバックを送信してください。

関連項目

Microsoft:

MDN:

GitHub: