<!DOCTYPE html><html><head> <meta charset=”utf-8″> <meta name=”viewport” content=”width=device-width, initial-scale=1″> <title>Scan Barcode</title> <link href=”https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css” rel=”stylesheet”> <script type=”text/javascript” src=”https://rawgit.com/schmich/instascan-builds/master/instascan.min.js”></script> <script type=”text/javascript” src=”https://cdnjs.cloudflare.com/ajax/libs/vue/2.1.10/vue.min.js”></script> <script type=”text/javascript” src=”https://cdnjs.cloudflare.com/ajax/libs/webrtc-adapter/3.3.3/adapter.min.js”></script></head><body> <div class=”row”> <div class=”col-md-6″> <video id=”preview” width=”100%”></video> </div> <div class=”col-md-6″> <form action=”” method=”POST”> <label>SCAN QR CODE</label> <input type=”text” class=”form-control” id=”id_visitor” autofocus placeholder=”Scan QR code”> </form> <br> </div> </div> <script type=”text/javascript”> let scanner = new Instascan.Scanner({ video: document.getElementById(‘preview’) }); Instascan.Camera.getCameras().then(function (cameras) { if (cameras.length > 0) { scanner.start(cameras[0]); } else { alert(‘No cameras found.’); } }).catch(function (e) { console.error(e); }); scanner.addListener(‘scan’, function (c) { document.getElementById(‘id_visitor’).value=c; document.forms[0].submit(); }); </script> <script src=”https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js”></script></body></html>
Terimakasih telah membaca di Aopok.com, semoga bermanfaat dan lihat juga di situs berkualitas dan paling populer Piool.com, peluang bisnis online Topbisnisonline.com dan join di komunitas Topoin.com.
