Рендеринг видео из js в html

Я здесь новичок и у меня есть вопрос. Как я могу перевести видео с веб-камеры из JavaScript в HTML? Я хочу сканировать QR-коды в браузере и во время сканирования должно быть видео с камеры для лучшего восприятия пользователем (легче найти qr-код). Для сканирования QR-кодов я использую Instascan. Мой код выглядит примерно так:

HTML:

<div class="video-container">
   <div class="overlay-box">
      <video id="preview"></video>
   </div>
</div>

JavaScript:

let scanner = new Instascan.Scanner({ video: document.getElementById('preview') });

// When starting scanning, activate via css
document.getElementById("preview").style.display = "block";

// When stopping scanning, deactivate via css
document.getElementById("preview").style.display = "none";

Я пробовал без css, но это не было проблемой. Это должна быть проблема со сканером ig...

Ожидание: рендеринг в html-файл, чтобы я мог видеть выход камеры при сканировании

Спасибо за любую помощь! PS: Если это важная информация (idk); он находится внутри проекта Django

Если я правильно понял, вы пытаетесь использовать веб-камеру пользователя для считывания QR-кода, так ли это? Если да, то вы можете попробовать использовать navigator.mediaDevices.getUserMedia() для этого. Более подробную информацию об этом методе вы можете получить здесь: https://developer.mozilla.org/en-US/docs/Web/API/MediaDevices/getUserMedia

Вернуться на верх