reactjsqr-codezxingscanning

zxing/library camera remains open after reset


If the scanner finds the result so fast, just after starting scanning, the camera remains open, even after resetting the scanner.

enter image description here

That red icon remains even after closing the scanner

Here is an example

If you place a QR code in front of the camera, so it can recognize it instantly when you turn ON the scanner, it closes with the result, but the red icon remains in the browser tab.

How I can prevent that? The icon should hide after closing the scanner. Same happens in android device, it says: A site is using your camera in the notifications section even after finishing scanning

If it finds the result few seconds after starting scanning, it works as expected. The problem happens if it finds the result immediately after starting scanning


Solution

  • I found the problem. It was because when I call

    navigator.mediaDevices.getUserMedia({ video: { facingMode: 'environment' } })
    

    it shows the red icon. scanner.reset() wasn't stopping it correctly. I wanted to use it just to get the deviceId of facingMode: environment. Stopping the track fixed the problem.

    const track = stream.getVideoTracks()[0];
    track.stop()      // here
    return track.getSettings().deviceId;