browser icon indicating copy to clipboard operation
browser copied to clipboard

BrowserCodeReader.listVideoInputDevices() doesn't ask for Camera permission on MacOS and iOS

Open andrijavulicevic opened this issue 2 years ago • 2 comments

Hello, I am using this library to implement a QR Code Scanner on a web page. And I have encountered strange behavior on MacOS and iOS browsers.

Method BrowserCodeReader.listVideoInputDevices() does not ask for permission to access Camera on mentioned OSes and code simply doesn't work at all, unless a user goes to Google Chrome settings and manually enables camera permission, and only after that this method works properly.

Here is a demo to test the bug: https://replit.com/@AndrijaVulicevi/QR-code-scanner#src/App.jsx

Reproducible on:

  • MacOS 12.5 with Google Chrome 103.x and Safari 15.6
  • iOS 15.6 with Safari iOS 15.6**

andrijavulicevic avatar Aug 03 '22 16:08 andrijavulicevic

I made this before listing

      const camera = await navigator?.mediaDevices
        ?.getUserMedia({ video: true })
        .catch(() => showWarning(t('captureModal.cameraUnavailable')))

      if (camera) {
          const videoInputDevices = await BrowserCodeReader.listVideoInputDevices()
...

obo-spi avatar Oct 05 '22 06:10 obo-spi

I made this before listing

      const camera = await navigator?.mediaDevices
        ?.getUserMedia({ video: true })
        .catch(() => showWarning(t('captureModal.cameraUnavailable')))

      if (camera) {
          const videoInputDevices = await BrowserCodeReader.listVideoInputDevices()
...

This one worked for me when we had problems in both Edge and Chrome (116.0.5845.141). This should be handled by listVideoInputDevices

systemutvecklare avatar Sep 06 '23 09:09 systemutvecklare