1

while accessing the webcam I'm getting blank screen like this enter image description here

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>
  );
}

I've tried in all the browsers and it's working fine on every browser except IE, Please help me regarding this, Thanks.

Artem Arkhipov
  • 7,025
  • 5
  • 30
  • 52
Ayush Singh
  • 13
  • 1
  • 4

1 Answers1

0

The issue is that webcam.js, same as any other library related to camera capturing, uses the getUserMedia API. However, it is not supported in Internet Explorer.

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

Worth to note, that this will not be supported in future either, as IE is now deprecated at all.

Webcam.js implemented the Flash fallback for such case, but, unfortunately Flash is not supported anymore in the modern web world. Flash player probably can be installed by user into IE separately, but it makes the general solution overcomplicated, requires additional actions from user with no guaranteed result.

Artem Arkhipov
  • 7,025
  • 5
  • 30
  • 52
  • Thank for replying, but is there any library that we can use to access webcam in IE 11 ? – Ayush Singh Aug 31 '20 at 14:18
  • i found this demo working in IE https://pixlcore.com/demos/webcamjs/demos/basic.html still can't figure out why it's not working on my local – Ayush Singh Aug 31 '20 at 14:30
  • @AyushSingh make sure Flash is available when you run locally. I am not sure how to do that, but you definitely need to investigate in that direction. – Artem Arkhipov Sep 01 '20 at 08:01