Error on Zxing Barcode Reader JS on Android Chrome

Question

I have been trying to implement barcode reader on my web page hosted in localhost iis.

The library that I am using is : <script type="text/javascript" src="https://unpkg.com/@@zxing/library@latest"></script>

My Code is:

const codeReader = new ZXing.BrowserMultiFormatReader();

 codeReader.decodeFromVideoDevice(undefined, 'webcam-preview', (result, err) => {
     if (result) {
         // properly decoded qr code
         console.log('Found QR code!', result)
         document.getElementById('result').textContent = result.text
     }

     if (err) {
         // As long as this error belongs into one of the following categories
         // the code reader is going to continue as excepted. Any other error
         // will stop the decoding loop.
         //
         // Excepted Exceptions:
         //
         //  - NotFoundException
         //  - ChecksumException
         //  - FormatException

         if (err instanceof ZXing.NotFoundException) {
             console.log('No QR code found.')
         }

         if (err instanceof ZXing.ChecksumException) {
             console.log('A code was found, but it\'s read value was not valid.')
         }

         if (err instanceof ZXing.FormatException) {
             console.log('A code was found, but it was in a invalid format.')
         }
     }
 })

My barcode reader is working on desktop browser 'chrome' however not opening the camera on any mobile browsers. I have tried chrome, firefox, opera.

When I check from chrome://inspect

I am getting this error from the dev. console

Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'getUserMedia')
at t.BrowserMultiFormatReader.<anonymous> (library@latest:15:29847)
at Generator.next (<anonymous>)
at library@latest:15:27264
at new Promise (<anonymous>)
at P (library@latest:15:27009)
at t.BrowserMultiFormatReader.decodeFromConstraints (library@latest:15:29776)
at t.BrowserMultiFormatReader.<anonymous> (library@latest:15:29708)
at Generator.next (<anonymous>)
at library@latest:15:27264
at new Promise (<anonymous>)

Trying on Chrome 98.0.4758.87

Samsung Galaxy S10+ Android 12

I thought the problem can be because of I am using http not https on localhost. But I am not sure.

Any ideas?

Thanks in advance.

Error on Zxing Barcode Reader JS on Android Chrome

0 Answers0