Thanks for downloading Dynamsoft Barcode Reader Package!
Your download will start shortly. If your download does not begin, click here to retry.
Let’s start by using the library to build a simple web application that will decode barcodes from a live video stream.
Create an HTML file with the following content. Deploy this to your web server and run the application over HTTPS.
PRODUCT-KEYSwith a trial key for the sample code to work correctly. You can acquire a trial key here.
http-serveron npm or yarn.
onFrameRead: This event is triggered after each single frame is scanned. The
results object contains all the barcode results that the library found on this frame. In this example, we will print the results found in every frame to the console.
onUnduplicatedRead: This event is triggered when a new barcode (not a duplicate) is found.
txt holds the barcode text value while
result is an object that holds details of the found barcode. In this example, an alert will be displayed for each unique barcode found.
Open the HTML page in your browser and you should see a pop-up asking for permission to access the camera. Once camera access is granted, the video stream will start in the default UI of the BarcodeScanner object.
Note: If you don’t see the pop-up, wait a few seconds for the initialization to finish.
In this step, you might run into the following issues:
If you open the HTML file as
http://, the following error may appear in the browser console:
[Deprecation] getUserMedia() no longer works on insecure origins. To use this feature, you should consider switching your application to a secure origin, such as HTTPS. See https://goo.gl/rStTGz for more details.
In Safari 12 the equivalent error is:
Trying to call getUserMedia from an insecure document.
To access the camera with the API getUserMedia, HTTPS is required.
Note: If you use Chrome or Firefox, you might not get the error because these two browsers allow camera access via file:/// and http://localhost.
To make sure your web application can access the camera, please configure your web server to support HTTPS. The following links may help.
For testing purposes, a self-signed certificate can be used when configuring HTTPS. When accessing the site, the browser might say “the site is not secure”. In this case, go to the certificate settings and set to trust this certificate.
In a production environment, you will need a valid HTTPS certificate.
Place a barcode in front of the camera. You should see an alert pop up with the decoded barcode result and a coloured region on the video to highlight the barcode location.
This page is compatible for: