JQuery HTML5 QR Code Scanner using Instascan JS Example
In this post we will give you information about JQuery HTML5 QR Code Scanner using Instascan JS Example. Hear we will give you detail about JQuery HTML5 QR Code Scanner using Instascan JS ExampleAnd how to use it also give you demo for it if it is necessary.
Are you looking for qr code scanner script using jquery html5? If yes then i will defiantly help to create simple example for qr code or barcode reader using webcam or mobile camera. we will use instascan js plugin for qr code scan.
Instascan JS is a real-time webcam-driven HTML5 QR code scanner. Instascan JS wil help to find all camera attach with your system or mobile and you can read barcode using anyone that you want.
So, basically, you have to copy bellow html code and run in your system. Then i also attach qr code for demo. So let’s see.
Index.html
<!DOCTYPE html>
<html>
<head>
<title>JQuery HTML5 QR Code Scanner using Instascan JS Example - ItSolutionStuff.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 - ItSolutionStuff.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>
You can also check this qr code:
I hope it can help you….
Hope this code and post will helped you for implement JQuery HTML5 QR Code Scanner using Instascan JS Example. if you need any help or any feedback give it in comment section or you have good idea about this post you can give it comment section. Your comment will help us for help you more and improve us. we will give you this type of more interesting post in featured also so, For more interesting post and code Keep reading our blogs