MediaRecorder：複数のマイクロフォンからの録音

Question

現在、アプリケーション内でオーディオを録音するのに、MediaRecorder APIを使用しています。

複数の入力デバイス、たとえば2つのマイクから録音する方法はありますか？

mediaDevices.enumerateDevices()を使って、hereと表示されているデバイスのリストを取得できます。

可能であれば、2つ以上のデバイスを選択して記録したいと考えています。

これは可能ですか？

Answer 1

この関数は、1つにあなたのトラックをマージします：

function mix(audioContext, streams) { 
    const dest = audioContext.createMediaStreamDestination(); 
    streams.forEach(stream => { 
    const source = audioContext.createMediaStreamSource(stream); 
    source.connect(dest); 
    }); 
    return dest.stream.getTracks()[0]; 
} 

Answer 2

解決策は、getUserMediaを複数要求し、ストリームをAudioContextと混合することでした。

ここでその方法を説明します。

const VIDEO_ID = 'video_id'; 
const MIC_1_ID = 'mic_1_id'; 
const MIC_2_ID = 'mic_2_id'; 

// Request permission 
navigator.mediaDevices.getUserMedia({video: true, audio: true}).then(() => { 

    // Loop over all available video and audio devices (input and output) 
    navigator.mediaDevices.enumerateDevices().then(devices => { 

     // Request exact devices 
     const requests = [ 
      navigator.mediaDevices.getUserMedia({video: {deviceId: {exact: VIDEO_ID}}}), 
      navigator.mediaDevices.getUserMedia({video: false, audio: {deviceId: {exact: MIC_1_ID}}}), 
      navigator.mediaDevices.getUserMedia({video: false, audio: {deviceId: {exact: MIC_2_ID}}}) 
     ]; 

     // Wait for all device requests to resolve. 
     Promise.all(requests).then(streams => { 
      const ctx = new AudioContext(); 
      const dest = ctx.createMediaStreamDestination(); 

      // Connect streams to the destination audio stream. 
      streams.map(stream => { 
       ctx.createMediaStreamSource(stream).connect(dest); 
      }); 

      const videoTrack = streams[0].getTracks()[0]; 
      const mixedTracks = dest.stream.getTracks()[0]; 

      // Combine video and audio tracks into single stream. 
      const stream = new MediaStream([videoTrack, mixedTracks]); 

      // Start recorder 
      const recorder = new MediaRecorder(this.stream, this.settings.recorder); 

      // ... 
     }); 

    }); 
});