如何在iOS/Safari中使用JavaScript Web Audio API从音频输入插孔采集音频

你的测试设备（iOS 14.8.1）对应的Safari版本支持指定音频输入源，可按以下步骤实现选择耳机插孔的音频输入：

实现步骤 #

1. 先获取媒体权限，再枚举可用音频输入设备 #

所有媒体相关API必须在用户交互事件（如按钮点击）的回调中执行，否则会被Safari的安全策略拦截：

// 先调用一次getUserMedia获取麦克风权限，才能拿到设备的真实标识
await navigator.mediaDevices.getUserMedia({ audio: true });
// 枚举所有媒体设备
const devices = await navigator.mediaDevices.enumerateDevices();
// 筛选所有音频输入设备
const audioInputs = devices.filter(device => device.kind === 'audioinput');
// 遍历查找插孔对应的输入设备，label一般包含「耳机」「线路输入」等标识
const targetDevice = audioInputs.find(item => item.label.includes('耳机') || item.label.includes('Line In'));

2. 在getUserMedia中指定目标设备的deviceId #

修改原有代码，加入deviceId参数锁定输入源：

return navigator.mediaDevices.getUserMedia({
    audio: {
      echoCancellation: false,
      autoGainControl: false,
      noiseSuppression: false,
      latency: 0,
      deviceId: targetDevice.deviceId // 填入选中的设备ID
    }
  })

注意事项 #

• 必须运行在HTTPS环境下，本地调试可使用localhost
• 低于iOS 14.5的系统版本不支持音频输入设备选择功能，无法使用该方案
• 如果枚举设备时看不到插孔对应的输入源，先确认外接音频设备支持输入功能，且已正常插入设备

内容的提问来源于stack exchange，提问作者Taciano Dreckmann Perez