Client-Side Barcode Recognition for Browser-Based Applications

Try Online Demo

Barcode Recognition JavaScript API

Dynamsoft's Barcode Reader is a recognition SDK which enables you to embed barcode reading functionality in your web, desktop, and mobile application. Its JavaScript Edition is browser-based and designed for web applications. With just a few lines of JavaScript code, you can develop a robust application to scan a linear barcode, QR Code, DataMatrix, and PDF417.

Support mainstream browsers on Windows

Your end users will have the flexibility on browsers: Internet Explorer version 6 and above, Edge, Firefox, and Chrome. The support for macOS and Linux (64-bit) machines will be available soon.

Support mainstream browsers on Windows

Easy integration and end-user distribution

  • MSI installer available for IT managers to easily do batch installations to their entire network.
  • Client-side language support: JavaScript, JQuery, VBScript, HTML5, HTML.
  • Server-side programming language support: ASP.NET (C#/VB.NET), PHP, JSP, ASP, etc.
  • There is no dependency on any third-party frameworks. So any web server is supported, such as Nginx, IIS, Tomcat, Apache and more.

Technical architecture

Dynamsoft Barcode Reader JavaScript Edition is composed of three layers: a JavaScript client, a Windows Service, and a core function DLL.

Browser JavaScript Client

  • This is the JavaScript library. It communicates with the Windows service. It accepts the operation requests from users and sends them to the service.

Windows Service

  • This module receives user operation commands from a JavaScript client. It listens on localhost and handles the interface with barcode recognition DLL and passes the response to the JavaScript layer. Users only need to install the service once.

Barcode recognition DLL

  • Barcode recognition DLL is where the barcode detection and decoding actually happens.

Integration for reading barcode from video streams and document scanners

There is one thing to be noted with the previous diagram. The Windows Service is not for Dynamsoft Barcode Reader's use only. In fact, it is shared by three of Dynamsoft's imaging products: Web TWAIN (starting from version 13.0), Camera SDK and Barcode Reader.

Browser

Barcode Recognition JavaScript Client

Web TWAIN JavaScript Client

Camera SDK JavaScript Client

Dynamsoft's Windows Service

DLLs

Barcode Recognition

Web TWAIN

Camera SDK

Code snippet on how to read barcode from video streams

//initiate Dynamsoft Camera SDK object
dynamsoft.dcsEnv.init('dcsVideoContainer', 'dcsImageContainer', onInitSuccess, onInitFailure);
// …
dcsObject = dynamsoft.dcsEnv.getObject(videoViewerId); //Get the Dynamsoft Camera SDK object
imageViewer = dcsObject.getImageViewer(imageViewerId); //Get a specific image viewer
// …
var dcsURL = imageViewer.image.getImagePartUrl(imageViewer.image.getIndex()); // capture one frame and save the image in an URL
// …
dbrObject.readURLAsync(dcsURL, userData, onReadSuccess, onReadFailure);