javascriptbrowserbarcode-scannerhtml5-qrcode

Problem with turning off barcode scanning when the browser is closed or the browser goes to the background on mobile at Html5-Qrcode


While using html5-qrcode on mobile or desktop, if the user closes the browser or changes the browser tab without stopping the html5-qrcode in scanning mode, html5-qrcode still uses the camera source as if it were scanning. This creates problems in my own application. Is it possible to stop html5-qrcode in scanning mode if the user closes the browser or puts it in the background on the mobile app or if the browser tab changes? What can be done for this in best practice? Or is there an integration for this need within the module? I would like to point out that I would like to thank the people who made this open source application. It saved me from buying a paid module.

Modele Github: Html5-Qrcode


Solution

  • A document.visibilityState event exists which tells you when the user stopped looking at your page...

    document.addEventListener('visibilitychange',()=>{
    
     if(document.visibilityState!=='visible'){
    
      // perform some task    
    
     }
    
    });
    

    NB: “stopped looking” means the browser got minimized or the user clicked on another tab or I don’t know what else.