getUserMedia在网站上有效，但在移动设备上无效

Question

我正在使用getusermedia在我的网站上录制音频。我已经包含了getusermedia的javascript。录制功能在网站上可以正常使用，但在移动设备上打开时甚至不会弹出权限对话框。

var constraints = {
  audio: true,
  video: false
}
navigator.mediaDevices.getUserMedia(constraints).then(function(stream) {
  permissiongiven = 1;
});

这是示例代码，提示我获得许可，但不适用于移动设备。 如何使它在两种设备上均可使用。任何帮助表示赞赏。 谢谢。

Answer 1

请注意，在移动设备上，必须使用SSL才能使用getUserMedia()。检查您是否使用http://前缀访问网站。尝试将其更改为https://，它应该可以正常工作。

Answer 2

我发现这个网站对回答这个问题很有帮助

https://caniuse.com/#search=getusermedia

它说getUserMedia仅受Chrome for Android 70版（2018年10月16日发布）支持

Answer 3

选中MDN，然后确保您的浏览器支持它。它说，您需要适用于Android 52+的Chrome。 FWIW 68 works for me。

您还应该进行功能检查并捕获错误：

if (!navigator.mediaDevices) {
  console.log("Sorry, getUserMedia is not supported");
  return;
}

navigator.mediaDevices.getUserMedia(constraints)
.then(stream => permissiongiven = 1)
.catch(error => console.log(error));

根据您遇到的错误，我们可能会了解更多。

• NotFoundError表示设备上未检测到相机或麦克风。
• NotAllowedError表示未授予用户权限，或者您位于iframe中，还是不在https中。

Answer 4

navigator.mediaDevices.getUserMedia浏览器兼容性

Answer 5

我不知道navigator.getUserMedia已过时（至少对于三星，这是我正在测试的对象），我发现this article on web audio的代码示例几乎没有修改：

function initGetUserMedia() {
  navigator.mediaDevices = navigator.mediaDevices || {}
  navigator.mediaDevices.getUserMedia = navigator.mediaDevices.getUserMedia || function(constraints) {
    let getUserMedia = navigator.webkitGetUserMedia || navigator.mozGetUserMedia;
    if (!getUserMedia) {
      return Promise.reject(new Error('getUserMedia not supported by this browser'));
    } else {
      return new Promise((resolve, reject) => {
        getUserMedia.call(navigator, constraints, resolve, reject);
      });
    }
  }
}