iPhone 连续互通摄像头在Safari的MediaDevices enumerateDevices()中不显示

你的代码逻辑本身没有问题，但Safari在处理iOS设备（包括通过连续互通相机连接到Mac的iPhone）的摄像头枚举时，存在几个特殊限制和需要注意的配置点：

1. 确保HTTPS环境与明确的视频约束 #

• Safari对非HTTPS环境（localhost调试除外）的媒体权限限制更严格，可能导致摄像头无法被枚举。请确认页面通过HTTPS部署。
• 仅指定video: true可能不足以触发Safari完整的设备检测，尝试添加更明确的视频约束，帮助浏览器识别可用摄像头：

  navigator.mediaDevices.getUserMedia({ 
    audio: true, 
    video: { 
      width: { ideal: 1280 }, 
      height: { ideal: 720 },
      facingMode: 'user' // 可指定'user'前置或'environment'后置，也可留空自动适配
    } 
  })
  

2. 重置Safari的媒体权限缓存 #

如果之前曾拒绝过网站的摄像头权限，Safari会缓存权限状态，导致后续枚举无法获取设备：

• iOS Safari：进入设置 > Safari > 网站设置 > 相机，找到你的网站并设置为允许
• macOS Safari：进入Safari设置 > 网站 > 相机，将对应网站的权限改为允许

3. 等待视频流就绪后再枚举设备 #

当iPhone作为外接摄像头（连续互通相机）时，Safari需要确保视频流完全就绪后，才能正确枚举到设备。可修改代码，在视频轨道就绪后再执行枚举：

navigator.mediaDevices.getUserMedia({ audio: true, video: true })
  .then(stream => {
    const videoTrack = stream.getVideoTracks()[0];
    
    // 确保视频轨道已激活再枚举设备
    function enumerateAvailableDevices() {
      if (!navigator.mediaDevices?.enumerateDevices) {
        console.log("enumerateDevices() not supported.");
      } else {
        navigator.mediaDevices.enumerateDevices()
          .then((devices) => {
            devices.forEach((device) => {
              console.log(`${device.kind}: ${device.label} id = ${device.deviceId}`);
            });
          })
          .catch((err) => {
            console.error(`${err.name}: ${err.message}`);
          });
      }
    }

    if (videoTrack.readyState === 'live') {
      enumerateAvailableDevices();
    } else {
      videoTrack.addEventListener('ready', enumerateAvailableDevices);
    }
  })
.catch(err => console.error("queryMediaDevices:Error", err));

4. 检查Safari实验性功能与系统版本 #

• 进入Safari的开发 > 实验性功能，确认WebRTC Device Enumeration相关选项处于开启状态
• 尝试更新到最新的macOS/iOS版本，修复可能存在的API实现bug

Google Meet等成熟应用针对Safari做了大量兼容性适配，包括更细致的权限请求流程、设备枚举时机处理，因此能正常识别摄像头。按上述几点调整后，应该可以解决你的问题。

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