A powerful, easy-to-use JavaScript barcode scanning library for web applications. Scan barcodes from camera streams or image files with just a few lines of code.
- Introduction
- Why Choose the JavaScript Ready-to-Use Edition
- Features
- Supported Barcode Formats
- Browser Support
- Installation
- Quick Start
- Live Demos
- Documentation
- Framework Integration
- License
- Support & Resources
Dynamsoft Barcode Reader JavaScript Edition (Ready-to-Use API) enables developers to integrate barcode scanning functionality into web applications with minimal effort. Built on industry-leading barcode recognition algorithms, it provides high accuracy and performance while maintaining an intuitive, developer-friendly API.
Get scanning in under 5 minutes with our pre-built UI and sensible defaults, or customize every aspect to match your application's requirements.
- Zero Configuration Required - Start scanning with a single line of code using built-in defaults
- Pre-built Camera UI - Professional viewfinder with scan region highlighting included out of the box
- High Accuracy - Industry-leading recognition algorithms with 99%+ accuracy on standard barcodes
- Cross-Platform - Works seamlessly across desktop and mobile browsers (Chrome, Firefox, Safari, Edge)
- Flexible Deployment - CDN, npm, or self-hosted options available
- Framework Friendly - Ready-made samples for React, Vue, Angular, Next.js, Nuxt, Svelte, and more
- Production Ready - Battle-tested by thousands of applications worldwide
- Fully Customizable - Access advanced configuration when you need precise control
- Live Camera Scanning - Real-time barcode detection from device cameras
- Image File Decoding - Read barcodes from uploaded images or files
- Multi-Barcode Detection - Scan multiple barcodes simultaneously with deduplication
- Customizable UI - Modify the built-in UI or create your own from scratch
- Scan Region Control - Define specific areas of the camera feed to scan
- High Performance - WebAssembly-powered for fast processing
- Responsive Design - Works on desktop and mobile devices
- Advanced Templates - Fine-tune recognition for challenging scenarios
1D Barcodes: Code 128, Code 39, Code 93, Code 11, Codabar, Interleaved 2 of 5, Industrial 2 of 5, ITF-14, EAN-8, EAN-13, UPC-A, UPC-E, MSI Code, GS1 DataBar, GS1 Composite
2D Barcodes: QR Code, Data Matrix, PDF417, Aztec, MaxiCode
Postal Codes: USPS Intelligent Mail, Postnet, Planet, Australian Post, UK Royal Mail (RM4SCC)
Patch Code
View all 50+ supported formats
| Browser | Desktop | Mobile |
|---|---|---|
| Chrome | 78+ | 78+ |
| Firefox | 68+ | 68+ |
| Safari | 14+ | 14+ |
| Edge | 79+ | 79+ |
<script src="https://cdn.jsdelivr.net/npm/dynamsoft-barcode-reader-bundle@11.4.2001/dist/dbr.bundle.js"></script>npm install dynamsoft-barcode-reader-bundle@11.4.2001yarn add dynamsoft-barcode-reader-bundle@11.4.2001<!DOCTYPE html>
<html>
<head>
<title>Barcode Scanner</title>
<script src="https://cdn.jsdelivr.net/npm/dynamsoft-barcode-reader-bundle@11.4.2001/dist/dbr.bundle.js"></script>
</head>
<body>
<script>
// Instantly launch scanner with built-in 24-hour trial license
new Dynamsoft.BarcodeScanner().launch().then((result) => {
alert(result.barcodeResults[0].text);
}).catch((error) => {
console.error(error);
alert("Error: " + error.message);
});
</script>
</body>
</html><!DOCTYPE html>
<html>
<head>
<title>Multi-Barcode Scanner</title>
<script src="https://cdn.jsdelivr.net/npm/dynamsoft-barcode-reader-bundle@11.4.2001/dist/dbr.bundle.js"></script>
</head>
<body>
<script>
new Dynamsoft.BarcodeScanner({
scanMode: Dynamsoft.EnumScanMode.SM_MULTI_UNIQUE,
onUniqueBarcodeScanned: (result) => {
console.log(`[${result.formatString}] ${result.text}`);
},
}).launch();
</script>
</body>
</html><!DOCTYPE html>
<html>
<head>
<title>Read from Image</title>
<script src="https://cdn.jsdelivr.net/npm/dynamsoft-barcode-reader-bundle@11.4.2001/dist/dbr.bundle.js"></script>
</head>
<body>
<input type="file" id="fileInput" accept="image/*" />
<div id="results"></div>
<script>
const scanner = new Dynamsoft.BarcodeScanner();
document
.getElementById("fileInput")
.addEventListener("change", async (e) => {
const file = e.target.files[0];
try {
const result = await scanner.decode(file);
document.getElementById("results").innerHTML =
result.decodedBarcodesResult?.barcodeResultItems
.map((item) => `${item.formatString}: ${item.text}`)
.join("<br>") || "No barcode found";
} catch (error) {
console.error(error);
document.getElementById("results").innerHTML = "Error: " + error.message;
}
});
</script>
</body>
</html>View All Live Demos - Explore interactive samples
- Batch Inventory Scanning
- Shopping Cart Builder
- Scan QR Codes
- Read Driver's License (PDF417)
- Scan DPM Codes
- Distance Scanning with Zoom
Getting Started
- User Guide - Step-by-step tutorial to build your first scanner
- API Reference - Complete API documentation
- Customization Guide - Learn how to customize the scanner
Advanced Topics
Pre-built samples available for popular frameworks:
| Framework | Sample Link |
|---|---|
| React | samples/frameworks/react |
| Vue 3 | samples/frameworks/vue |
| Angular | samples/frameworks/angular |
| Next.js | samples/frameworks/next |
| Nuxt 3 | samples/frameworks/nuxt |
| Svelte | samples/frameworks/svelte |
| Electron | samples/frameworks/electron |
| Capacitor | samples/frameworks/capacitor |
A built-in 24-hour trial license is automatically used if no license is configured. This allows you to test the SDK immediately without any setup.
For extended evaluation beyond 24 hours, request a free 30-day trial license.
For production deployment, contact sales to purchase a commercial license.
To configure your license:
const scanner = new Dynamsoft.BarcodeScanner({
license: "YOUR_LICENSE_KEY_HERE",
});Contact Support - support@dynamsoft.com
Copyright © 2003–2026 Dynamsoft. All Rights Reserved.
The use of Dynamsoft Barcode Reader JavaScript Edition is governed by the Dynamsoft Terms and Conditions.