The code below demonstrates how to specify enabled symbologies let runtimeSettings = await scanner. updateRuntimeSettings ( " speed " ) // make changes to the template. use one of the built-in RuntimeSetting templates: "single" (decode a single barcode, the default mode), "speed", "balance" and "coverage" await scanner. The following shows how it could be used.
Contact us for more information.Īn alternative way to specify the license is to use an alphanumeric string which does not require a network connection.
If nothing is specified, a 7-day free license will be used by default which is the case in the above “hello world” example.Network connection is required for the license to work.licenseServer = //Optional, ignore this line if you are using Dynamsoft-hosting DLS. sessionPassword = " PASSWORD-TO-PROTECT-YOUR-LICENSE " // Optional but recomended, use it to protect your license. handshakeCode = " A-SPECIFIC-HANDSHAKECODE " // Optional, if not specified, the default handshake code is used. organizationID = " YOUR-ORGANIZATION-ID " // Required. The “hello world” example above uses jsDelivr.ĭynamsoft. The simplest way to include the library is to use either the jsDelivr or UNPKG CDN. Building your own page Include the library Use a CDN If the test doesn’t go as expected, you can check out the FAQ or contact us. Network connection is required for the 7-day free license to work. However, when no license is specified in the code, Dynamsoft allows a 7-day free period during which you can make initial evaluation of the library to decide whether or not you want to evaluate it further. The interval between two consecutive frames might not be enough time for the library to process the 1st frame (for 30 FPS, the interval is about 33 ms), therefore, not all frames are scanned. The library only scans a new frame when it has finished scanning the previous frame. At the same time, the barcode location will be highlighted in the video feed.įor first use, you may need to wait a few seconds for the library to initialize. If the barcode is decoded, an alert will pop up with the result text. After that, you can point the camera at something with a barcode to read it.
Download a copy of the example code and set it up locallyĮither way, you open the example page in a browser, allow the page to access your camera and the video will show up on the page.You can choose one of three ways to test the example: Show(): This method brings up the built-in UI of the BarcodeScanner object and starts scanning. In this example, an alert will be displayed for this new barcode. txt holds the barcode text value while result is an object that holds details of the barcode. OnUnduplicatedRead: This event is triggered when the library finds a new barcode, which is not a duplicate among multiple frames. In this example, we print the results to the browser console. The results object contains all the barcode results that the library have found on this frame. OnFrameRead: This event is triggered every time the library finishes scanning a video frame. This object can read barcodes directly from a video input with the help of its interactive UI (hidden by default) and the MediaDevices interface. You can also find the code (with more comments) on GitHub.ĬreateInstance(): This method creates a BarcodeScanner object. initializes and uses the library let pScanner = null ( async () => )() The complete code of the “Hello World” example is shown below Let’s start by testing the “Hello World” example of the library which demonstrates how to use the minimum code to enable a web page to read barcodes from a live video stream. In this guide, you will learn step by step on how to integrate this library into your website.įor back-end barcode reading with Node.js, see Dynamsoft Barcode Reader for Node. Once integrated, your users can open your website in a browser, access their cameras and read barcodes directly from the video input. Turn your web page into a barcode scanner with just a few lines of code. The html code in render() and the following code builds the UI for the library.Javascript-barcode Dynamsoft Barcode Reader for Your Website dbr " import React from ' react ' class BarcodeScanner extends React.