在使用webcam.js的React项目中，网络摄像头不适用于IE11

Question

当访问网络摄像头时，我得到了这样的空白屏幕

​

import React from "react";
import Webcam from './webcam.js'
export default function Camera() {

 const renderCamera = () => {
    Webcam.set({
      width: 320,
      height: 240,
      image_format: "jpeg",
      jpeg_quality: 90,
    });
    Webcam.attach("#my_camera");
  };

  const take_snapshot = () => {
    // take snapshot and get image data
    Webcam.snap(function (data_uri) {
      // display results in page
      document.getElementById("results").innerHTML =
        "<h2>Here is your image:</h2>" + '<img src="' + data_uri + '"/>';
    });
  };
  return (
    <div className="App">
      <h1>Image Capture</h1>
      <button onClick={renderCamera}>open Camera</button>
      <div id="my_camera"></div>
      <div id="results">Your captured image will appear here...</div>
      <button onClick={take_snapshot}>take a picture</button>
    </div>
  );
}

我在所有的浏览器上都试过了，除了IE之外，它在所有的浏览器上都工作得很好，请在这方面帮我一下，谢谢。

Answer 1

问题是，与其他任何摄像头采集相关的库一样，webcam.js也使用getUserMedia接口。但是，它在Internet Explorer中不受支持。

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

值得注意的是，这在未来也不会被支持，因为IE现在已经完全被弃用了。

Webcam.js为这种情况实现了闪存回退，但不幸的是，在现代网络世界中不再支持闪存。Flash player可能可以由用户单独安装到IE中，但这使得一般的解决方案过于复杂，需要用户进行额外的操作，效果没有保证。