Virus Corona (Covid-19)

Dapatkan Informasi terbaru

Contoh JQuery HTML5 Scanner QR Code menggunakan Instascan JS

IF MAN 14 Apr 2020 3,077

Apakah Anda mencari skrip pemindai qr code menggunakan jquery html5? Jika ya maka saya pasti akan membantu membuat contoh sederhana untuk qr code atau pembaca barcode menggunakan kamera web atau webcam. kita akan menggunakan plugin js instascan untuk memindai qr code.

Instascan JS adalah pemindai QR Code HTML5 berbasis webcam waktu nyata. Instascan JS akan membantu menemukan semua kamera terpasang dengan sistem atau ponsel Anda dan Anda dapat membaca barcode menggunakan siapa saja yang Anda inginkan.

Jadi, pada dasarnya, Anda harus menyalin kode html di bawah ini dan menjalankannya di sistem Anda. Kemudian saya juga melampirkan qr code untuk demo. Jadi mari kita lihat.

Index.html

<!DOCTYPE html>
<html>
<head>
<title>JQuery HTML5 QR Code Scanner using Instascan JS Example - Medikre.com</title>
 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
 <script src="https://rawgit.com/schmich/instascan-builds/master/instascan.min.js"></script>
</head>
<body>
  
  <h1>JQuery HTML5 QR Code Scanner using Instascan JS Example - Medikre.com</h1>
    
    <video id="preview"></video>
    <script type="text/javascript">
      let scanner = new Instascan.Scanner({ video: document.getElementById('preview') });
      scanner.addListener('scan', function (content) {
        alert(content);
      });
      Instascan.Camera.getCameras().then(function (cameras) {
        if (cameras.length > 0) {
          scanner.start(cameras[0]);
        } else {
          console.error('No cameras found.');
        }
      }).catch(function (e) {
        console.error(e);
      });
    </script>
   
</body>
</html>

Anda juga dapat memeriksa qr code ini:

Saya harap ini dapat membantu Anda ....

Tags

instascan js javascript jquery jquery plugin

Related Stories


Latest Stories


Close Ads X