如何从多路音频输入源获取单路输入 基于getUserMedia指定对应通道

问题核心原因 #

你遇到的两路音频混合问题，本质是因为浏览器默认将多通道输入盒识别为单个多声道音频设备，deviceId 对应的是整台设备而非单个输入通道，仅指定 deviceId 会获取所有通道的混缩流。

解决方法 #

方法1：确认设备是否暴露独立通道的deviceId #

部分专业输入盒会在系统中注册为两个独立的音频输入设备，分别对应两路输入，你可以先通过设备枚举验证：

// 枚举所有音频输入设备
const devices = await navigator.mediaDevices.enumerateDevices();
const audioInputs = devices.filter(d => d.kind === 'audioinput');
console.log(audioInputs);

如果枚举结果中出现2个对应你输入盒的设备项，直接分别传入对应deviceId即可获取独立的单路流，这是最简便的方案。

方法2：通过Web Audio API拆分多声道流 #

如果枚举仅能获取到一个deviceId，你需要在请求流时明确保留多声道配置，再用通道分离器拆分单路流：

步骤1：请求原始多声道流

请求时关闭所有音频预处理逻辑，明确指定通道数，避免浏览器自动混缩：

const stream = await navigator.mediaDevices.getUserMedia({
  audio: {
    deviceId: "你的输入盒deviceId",
    channelCount: 2,
    echoCancellation: false,
    noiseSuppression: false,
    autoGainControl: false
  }
});

步骤2：拆分通道获取单路流

使用ChannelSplitterNode拆分两路通道，导出为独立的MediaStream：

const audioCtx = new AudioContext();
const sourceNode = audioCtx.createMediaStreamSource(stream);
const splitterNode = audioCtx.createChannelSplitter(2);
sourceNode.connect(splitterNode);

// 获取第一路输入流（通道索引0）
const ch1Dest = audioCtx.createMediaStreamDestination();
splitterNode.connect(ch1Dest, 0);
const channel1Stream = ch1Dest.stream;

// 获取第二路输入流（通道索引1）
const ch2Dest = audioCtx.createMediaStreamDestination();
splitterNode.connect(ch2Dest, 1);
const channel2Stream = ch2Dest.stream;

注意事项 #

• 通道索引顺序由设备驱动决定，若拆分后两路输入对应关系相反，交换索引0和1即可
• Windows下部分专业输入盒需要安装官方ASIO驱动才会暴露独立的单通道输入设备，macOS可通过「音频MIDI设置」创建聚合设备为单路输入生成独立deviceId

内容的提问来源于stack exchange，提问作者user2961688