This repository contains multiple samples that demonstrates how to use the Dynamsoft Barcode Reader JavaScript Edition for creating web-based barcode scanning applications.
Cloning the full repository may be slow due to its extensive history. To get started quickly, you have a few options:
git clone https://github.com/Dynamsoft/barcode-reader-javascript-samples.git --depth 1 Note
If you expect unstable network conditions or prefer to work entirely offline, you can download the offline package from Dynamsoft website. This includes the full repository and all required dependencies for offline use.
Running the Samples Locally
Opening HTML files directly may not work as expected. Instead, run a local development server. Here’s a quick method using Visual Studio Code:
-
Install the Five Server extension from the VS Code Marketplace.
-
Right-click on
hello-world.htmland select "Open with Five Server". This will serve the application athttp://127.0.0.1:5500/hello-world.html.
A default license is included which allows you to test the sample apps for up to 24 hours. You can request a 30-day trial license via Dynamsoft website to evaluate further.
For the developer guide and full API reference of Dynamsoft Barcode Reader JavaScript library, please check out the documentation.
If you have any questions, feel free to contact Dynamsoft support.
- angular/ — Angular examples.
- blazor/ — Blazor (.NET) examples.
- capacitor/ — Capacitor mobile hybrid examples.
- electron/ — Electron desktop examples.
- es6/ — Plain ES6 module examples.
- native-ts/ — Native TypeScript examples.
- next/ — Next.js examples.
- nuxt/ — Nuxt examples.
- pwa/ — Progressive Web App examples.
- react/ — React examples.
- requirejs/ — RequireJS (AMD) examples.
- svelte/ — Svelte examples.
- vue/ — Vue examples.
- webview/ — Native WebView examples for Android/iOS.
- pick-one-to-fill/ — Picking the correct one from multiple candidates by scanning barcodes.
- cart-builder/ — Single-page demo illustrating adding scanned items into a shopping cart.
- scan-and-search/ — Example that scans a barcode and performs a lookup/search operation.
- show-result-texts-on-the-video/ — Overlay decoded text on live video while scanning.
- batch-inventory/ — Batch scanning workflow for inventory collection and export.
- read-a-drivers-license/ — Demo for reading and parsing a driver's license image/data.
- read-vin/ — Demo for reading and parsing a VIN(vehicle identification number) code.
- read-and-parse-GS1-AI/ — Example showing GS1 AI parsing and data extraction.
- scan-qr-code/ — QR code targeted demo and settings.
- scan-common-1D-and-2D/ — Demo configured to detect a wide range of barcode formats.
- scan-common-2D-codes/ — Focused on common 2D barcode formats decoding.
- scan-datamatrix-code/ — DataMatrix code targeted demo with optimized settings.
- scan-1D-Retail/ — 1D retail barcode tuning example.
- scan-1D-Industrial/ — 1D industrial barcode tuning example.
- scan-from-distance/ — Demo for scanning barcodes from a distance (zoom/ROI tuning).
- locate-an-item-with-barcode/ — UI to help locate items with barcodes in a list or layout.
- debug/ — Debug utilities and a small server (frame collector) used for testing and troubleshooting.
- Official Online Demo: Official demo for Dynamsoft Barcode Reader JavaScript Edition (written in Vue). Take our barcode scanner demo and see how it works in different modes!
