demo/video.html

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <meta http-equiv="X-UA-Compatible" content="ie=edge" />
  <title>QrcodeDecoder - Video</title>
</head>

<body>
  <button id="start">Start</button> <button id="stop">Stop</button><br />
  <span id="result">Click start to scan qrcode.</span><br />

  <video src="./assets/qrcode-video.mp4"></video>
  <script src="./lib/vconsole.min.js"></script>
  <script src="./lib/index.min.js"></script>
  <script type="text/javascript">
    var vConsole = new VConsole();
    function main() {
      var video = document.querySelector('video');
      var result = document.querySelector('#result');
      var start = document.querySelector('#start');
      var stop = document.querySelector('#stop');
      var qr = new QrcodeDecoder.default();

      start.onclick = startScan;

      stop.onclick = function () {
        qr.stop();
        video.pause();
      };

      async function startScan() {
        video.play();
        const code = await qr.decodeFromVideo(video);
        console.log('code', code);
        result.innerText = 'Result: ' + code.data;
      }
    }
    main();
  </script>
</body>

</html>