Android / Ionic上navigator.mediaDevices.getUserMedia的DOMException

Question

我正在尝试通过手机摄像头并使用WebRTC流式传输视频元素。我这样做如下（摘要）：

    <video id="yourVideo" autoplay muted playsinline></video>

    var yourVideo = document.getElementById("yourVideo");
    // ...

    navigator.mediaDevices.getUserMedia({audio:false, video:true}).
    then(function(stream){
        console.log(stream)
        yourVideo.srcObject = stream
        pc.addStream(stream)
    })
    .catch(function(error){
        console.log(error)
    })

这在浏览器中工作正常，并且显示了我的视频/摄像机。但是，在电话上它向我返回错误DOMException。我找不到任何可以解释这一点的信息。

Running it Ionic V1.X
ionic cordova run android

当我运行navigator.mediaDevices时，这就是我看到的：

也许许可相关？如果是这样，我该如何解决？

Answer 1

您将必须先获取设备源，然后尝试流，尝试这种方式

var videoElement = document.getElementById("yourVideo");
var videoSrc = undefined;

navigator.mediaDevices.enumerateDevices()
  .then(getDevices).then(getStream).catch(handleError);

function getDevices(deviceInfos) {
  for (var i = 0; i !== deviceInfos.length; ++i) {
    var deviceInfo = deviceInfos[i];
    if (deviceInfo.kind === 'videoinput') {
      videoSrc = deviceInfo.deviceId;
      break;
    }
  }
}

function getStream() {    
  navigator.mediaDevices.getUserMedia({
    video: {
      deviceId: {
        exact: videoSrc
      }
    }
  }).
  then(gotStream).catch(handleError);
}

function gotStream(stream) {
  videoElement.srcObject = stream;
}

function handleError(error) {
  console.log('Error: ', error);
}