Question

我正在尝试在getUserMedia的帮助下访问iOS Safari上的麦克风。您可以在下面找到我的代码段。

if (navigator.mediaDevices === undefined) {
  navigator.mediaDevices = {};
}

if (navigator.mediaDevices.getUserMedia === undefined) {
  navigator.mediaDevices.getUserMedia = function(constraints) {
    // First get ahold of the legacy getUserMedia, if present
    let getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia;

    // Some browsers just don't implement it - return a rejected promise with an error
    // to keep a consistent interface
    if (!getUserMedia) {
      return Promise.reject(new Error('getUserMedia is not implemented in this browser'));
    }

    // Otherwise, wrap the call to the old navigator.getUserMedia with a Promise
    return new Promise(function(resolve, reject) {
      getUserMedia.call(navigator, constraints, resolve, reject);
    });
  }
}

navigator.mediaDevices.getUserMedia({
  audio: true
}).then(function(stream) {
  successCallBack(.......);
}).catch(function(error) {
  debug.log(error);
  ..........
});

但是，promise总是会捕获错误，更确切地说是OverConstraintError。

{message: "Invalid constraint", constraint: ""}

此行为对于iOS Safari而言是唯一的，在所有其他浏览器（Chrome，Firefox，Safari osX）上，它都可以正常工作。实际上，我的问题很像这样=> How to resolve iOS 11 Safari getUserMedia "Invalid constraint" issue，但我并没有尝试使用相机。唯一让我感兴趣的是麦克风。

我正在用真实的iPhone（5和X，都更新为最新版本）进行测试，因此它未与iPhone Simulator链接。

已授予对麦克风的访问权限，并且还会显示请求权限的弹出窗口，因此这不是权限问题。

Answer 1

此问题可能与标题为 getUserMedia的错误报告有关，该错误报告在未找到任何设备时失败，并显示OverConstrainedError ：

https://bugs.webkit.org/show_bug.cgi?id=177126

这是您在Codepen中运行的代码。如您所述，音频已启用并且可以正常工作。注意enumerateDevices()调用返回一个空数组。如错误所述，这会导致您的问题中出现错误：

.catch(function(error) {
  navigator.mediaDevices.enumerateDevices().then(devices=>{console.log(devices)});
  console.log('error: ',error);
});

https://codepen.io/anon/pen/rQWRyZ?editors=0011

Answer 2

web rtc或getusermedia出现了一些问题，并且不能按您期望的那样在所有平台上都可以工作-相机检测存在相同的问题，例如在三星s5中，相同的代码可以正常工作，但是在较新的设备上却失败了。

我的建议是使用webrtc适配器js。尝试仅包含以下脚本：

<script src="https://cdnjs.cloudflare.com/ajax/libs/webrtc-adapter/6.4.0/adapter.js" type="text/javascript"></script>

在使用getusermedia api之前。我认为99％的问题都消失了。

在iOS Safari上借助getUsermedia访问麦克风

2 个答案: