在安卓设备上使用getUserMedia时出现绿屏问题

Question

在安卓设备上使用getUserMedia时出现绿屏问题

androidgoogle-chromevideogetusermedia

5

我正在尝试使用getUserMedia将摄像头实时流显示在网页上。它可以正常工作（如果我将流保存到文件中，它是好的），但视频标签仅显示静态绿色图像作为预览。有人遇到同样的问题吗？

我的设置：

三星S8（SM-G950F）
Android 9
Chrome 107.0.5304.91

HTML

<video autoplay="true" width="100%" id="video-test"></video>

JS

var video = document.querySelector("#video-test");

navigator.mediaDevices.getUserMedia({
      video: {
        mandatory: { minFrameRate: 10, minWidth: 100, minHeigth: 100  },
      }
 })
 .then(function (stream) {
      video.srcObject = stream;
 })
 .catch(function (err0r) {
      console.log("Something went wrong!", err0r);
 });

结果

谢谢

- user2880516

你能解决你的问题吗？我也遇到了同样的问题，我注意到在我的手机（P20 Pro）上，直到我更新Chrome之前，我并没有遇到这个问题。 - Daniel Baychev

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- O. Jones · Accepted Answer

啊，绿色死亡屏幕。为什么它是绿色的呢？因为它试图显示一个全零的YUV图像。

您调用.getUserMedia()时的限制条件不正确。mandatory已经不存在了。您需要类似这样的东西：

{
  video: {
    width: { min: 100, ideal: 320 },
    height: { min: 100, ideal: 240 },
    frameRate: { min: 10, ideal: 10 }
  }
}

不得不承认一个不方便的事实，那就是你必须费尽心思才能获得适用于许多平台的约束条件值。而且，你必须接受gUM给你的东西。如果你要求使用像frameRate: { exact: 10 }这样的东西来获得精确的约束条件，你可能会收到OverconstrainedError异常或其他异常。