IOS can't find variable: ImageCapture

Question

Hi I'm using ImageCapture in javascript to capture a photo from device camera video on my webapp.

The feature works fine on desktop, but on my iphone(safari) I get this error:

Can't find variable: ImageCapture

Here is my code:

// get camera permission and start the stream
var stream, imageCapture; 
function getMediaStream() {
  if (!window.navigator.mediaDevices) {
    $("#unsupported").show();
    $("#valid-permissions").hide();
    $("#invalid-permissions").hide();
    $("#alternative-button").show();
    return; 
  } 
  window.navigator.mediaDevices.getUserMedia({video: {facingMode:'environment'}})
    .then(function(mediaStream)
  { 
    stream = mediaStream; 
    let mediaStreamTrack = mediaStream.getVideoTracks()[0];
    imageCapture = new ImageCapture(mediaStreamTrack);
    var video = document.querySelector('#webcam');
      video.srcObject = mediaStream;
      video.onloadedmetadata = function(e) {
        video.play();
    };
  })
  .catch(function (error) {
    // this alert gives me the error above
    alert(error.message);
     $("#valid-permissions").hide();
     $("#unsupported").hide();
     $("#invalid-permissions").show();
     $("#alternative-button").show();
 });
}

Answer 1

It looks like ImageCapture is not a supported Web API in Safari (showing only ?s in the table provided here: https://developer.mozilla.org/en-US/docs/Web/API/ImageCapture#Browser_compatibility).

However, there is a polyfill available from Google Chrome Labs here: https://github.com/GoogleChromeLabs/imagecapture-polyfill

You may be able to use the polyfill to achieve your goals in Safari.