我可以使用 MediaDevices.getUserMedia() 为 webrtc 流连接到多个音频输入设备吗？

Question

我没有在 getUserMedia 文档中找到对此的任何支持。如果我只能通过约束请求一个音频设备，我想知道是否可以为第二个音频设备再次调用 getUserMedia，然后 merge/combine 将结果流合并为一个，以便我可以将它附加到单个 audio/video 元素。

我的最终目标是建立一个由视频和 2 个音频输入设备组成的 webrtc 流。我已经有一个带有视频和单个音频输入设备的 webrtc 流设置，我只是想合并到一个额外的音频流中。我提到这一点是为了防止在 webrtc 方面也有一些选项。

综上所述，如果有合并流的解决方案，是否会担心保持音频同步？

提前致谢！

Answer 1

你可以做的是请求音频1和视频1的媒体流。然后是audio2的媒体流。使用 let track = stream2.getTracks()[0] 获取 stream2 的曲目，然后使用 stream1.addTrack(track) 将此曲目添加到 stream1。然后 Stream1 包含您需要的所有曲目。 addTrack function

Answer 2

具有多个音频 and/or 视频轨道的流没有用处，因为只会播放第一轨道。但是，您可以传输两个流并在单独的视频元素中播放它们。

如果您想混合音频，webaudio 可以实现。

Answer 3

所以我最终创建了这个函数来完成流合并：

function createMergedStream(...streams: MediaStream[]): MediaStream {
    const audioContext = new AudioContext()

    const audioSources: MediaStreamAudioSourceNode[] = []
    const videoTracks: MediaStreamTrack[] = []

    streams.forEach((stream) => {
        stream.getTracks().forEach((track) => {
            if (track.kind === "video") {
                videoTracks.push(track)
            }
        })
        audioSources.push(audioContext.createMediaStreamSource(stream))
    })

    const destination = audioContext["createMediaStreamDestination"]()
    audioSources.forEach((audioSource) => {
        audioSource.connect(destination)
    })

    videoTracks.forEach((track) => {
        destination.stream.addTrack(track)
    })

    return destination.stream
}

原来客户实际上是想从多通道音频接口访问多个通道，所以我还有更多的挖掘工作要做。我想无论如何我都会分享这段代码，以防有人偶然发现这个 post.

我可以使用 MediaDevices.getUserMedia() 为 webrtc 流连接到多个音频输入设备吗？

Can I connect to multiple audio input devices using MediaDevices.getUserMedia() for a webrtc stream?

audio

video-streaming

webrtc

web-audio-api

getusermedia