Web Audio APIを使用した音声文字起こしで話者のフィードバックを防ぐ方法

Assembly.ai トランスクリプション エンジンをフロントエンドのうるさいフロントエンドに接続するために、最近理解する必要があったことがもう 1 つありました。

私が試したことは次のとおりです:

1. エコーキャンセルを使用してマイクへのアクセスをリクエストします。
2. Web Audio API を使用してオーディオ処理チェーンをセットアップします。
3. このセットアップを音声認識と統合します。
4. 追加のオーディオ処理には DynamicsCompressorNode を利用します。

ステップ 1: エコー キャンセルを使用してマイク アクセスを要求する

最初のステップは、エコー キャンセルを有効にしてマイクへのアクセスをリクエストすることです。この機能はほとんどの最新ブラウザに組み込まれており、スピーカーからのフィードバックを軽減するのに役立ちます。

async function getMicrophoneStream() {
    const constraints = {
        audio: {
            echoCancellation: true,
            noiseSuppression: true,
            autoGainControl: true
        }
    };

    try {
        const stream = await navigator.mediaDevices.getUserMedia(constraints);
        return stream;
    } catch (err) {
        console.error('Error accessing the microphone', err);
        return null;
    }
}

説明

• 制約: エコー キャンセル、ノイズ抑制、自動ゲイン制御を有効にするオーディオ制約を指定します。
• エラー処理: ユーザーがアクセスを拒否した場合、またはその他の問題がある場合、エラーを捕捉してログに記録します。

ステップ 2: Web オーディオ API ノードをセットアップする

次に、オーディオ ストリームを処理するために Web Audio API を設定します。これには、AudioContext の作成と、DynamicsCompressorNode を含むさまざまなノードの接続が含まれます。

async function setupAudioProcessing(stream) {
    const audioContext = new AudioContext();
    const source = audioContext.createMediaStreamSource(stream);

    // Create a DynamicsCompressorNode for additional processing
    const compressor = audioContext.createDynamicsCompressor();
    compressor.threshold.setValueAtTime(-50, audioContext.currentTime); // Example settings
    compressor.knee.setValueAtTime(40, audioContext.currentTime);
    compressor.ratio.setValueAtTime(12, audioContext.currentTime);
    compressor.attack.setValueAtTime(0, audioContext.currentTime);
    compressor.release.setValueAtTime(0.25, audioContext.currentTime);

    // Connect nodes
    source.connect(compressor);
    compressor.connect(audioContext.destination);

    return { audioContext, source, compressor };
}

説明

• AudioContext: オーディオ環境を表します。
• MediaStreamSource: マイク ストリームをオーディオ コンテキストに接続します。
• DynamicsCompressorNode: オーディオ信号のダイナミック レンジを低減し、バックグラウンド ノイズとフィードバックの管理に役立ちます。

ステップ 3: 音声認識との統合

最後に、音声処理セットアップを Web Speech API と統合して、音声認識を実行します。

async function startSpeechRecognition() {
    const stream = await getMicrophoneStream();
    if (!stream) return;

    const { audioContext, source, compressor } = await setupAudioProcessing(stream);

    const recognition = new (window.SpeechRecognition || window.webkitSpeechRecognition)();
    recognition.continuous = true;
    recognition.interimResults = true;

    recognition.onresult = (event) => {
        for (let i = event.resultIndex; i < event.results.length; i++) {
            const transcript = event.results[i][0].transcript;
            console.log('Transcript:', transcript);
        }
    };

    recognition.onerror = (event) => {
        console.error('Speech recognition error', event.error);
    };

    recognition.start();

    // Handle audio context resume if needed
    if (audioContext.state === 'suspended') {
        audioContext.resume();
    }

    return recognition;
}

// Start the speech recognition process
startSpeechRecognition();

説明

• 音声認識セットアップ: 継続的および暫定的な音声認識用に Web Speech API をセットアップしました。
• イベント処理: 認識結果とエラーを処理するために、onresult イベントと onerror イベントを処理します。
• 認識の開始: 音声認識プロセスを開始し、音声コンテキストが中断されていないことを確認します。

これがお役に立てば幸いです。

コーディングを楽しんでください!

ティム

以上がWeb Audio APIを使用した音声文字起こしで話者のフィードバックを防ぐ方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。