相关疑难解决方法(0)

我正在开发一个简单的应用程序,在此我试图访问相机和麦克风使用getUserMedia.它适用于桌面Chrome和Android Chrome,但在iPhone和iPad Chrome中无效.

navigator.getUserMedia = navigator.getUserMedia
        || navigator.webkitGetUserMedia || navigator.mozGetUserMedia || navigator.msGetUserMedia;
var constraints = "";
if (mediaType === "audio,video") {
    constraints = {
        audio : true,
        video : true
    };
} else {
    constraints = {
        audio : true,
        video : false
    };
}
navigator.getUserMedia(constraints, successCallback, errorCallback);

我在我的项目中添加了这段代码

if (navigator.mediaDevices === undefined) {
  navigator.mediaDevices = {};
}

if (navigator.mediaDevices.getUserMedia === undefined) {
  navigator.mediaDevices.getUserMedia = function (constraints) {

    var getUserMedia = (
      navigator.getUserMedia ||
      navigator.webkitGetUserMedia ||
      navigator.mozGetUserMedia
    );

    if (!getUserMedia) {
      return Promise.reject(new Error('getUserMedia is not implemented in this browser'));
    }

    return new Promise(function (resolve, reject) {
      getUserMedia.call(navigator, constraints, resolve, reject);
    });

  };
}

然后我正在尝试使用的视频流 getUserMedia

navigator.mediaDevices.getUserMedia({
    video: true,
    audio: false
}).then(stream => {
    // do stuff
}).catch(error => {
    console.log(error.name + " " + error.message);
});

当我在我的模拟器中测试它时,它适用于Android版本5及更高版本,但是当我在实际设备上运行时,我收到此错误 …

我有以下限制，这些限制在桌面版 Chrome 上运行得很好（模拟移动分辨率）

const constraints = {
    audio: false,
    video: {
        width: screen.width,
        height: screen.height
    }
};

navigator.mediaDevices.getUserMedia(constraints).then(stream => {})

然而，当在 iPhone / Safari 上实际尝试时，相机根本不考虑这一点，并且变得超小或扭曲 - 从约束中删除宽度/高度使其具有更好的比例，但根本不是全屏，只是集中。

我也尝试过最小/最大约束，但没有幸运。

有什么方法可以让它在 iPhone 上运行吗？