Polyfill for the Barcode Detection API based on Dynamsoft Barcode Reader or ZXing.
-
Via CDN:
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/dbr.js"></script> <script type="text/javascript" src="https://unpkg.com/@zxing/browser@latest"></script> <script src="https://cdn.jsdelivr.net/npm/barcode-detection@latest/dist/barcode-detector.umd.js"></script>
-
Via npm:
npm install barcode-detection
Then import the package:
import {default as BarcodeDetectorPolyfill} from "barcode-detection"
let barcodeDetector;
async function init() {
if ("BarcodeDetector" in window) {
alert('Barcode Detector supported!');
}else{
alert('Barcode Detector is not supported by this browser, using the Dynamsoft Barcode Reader polyfill.');
BarcodeDetectorPolyfill.engine = "DBR"; // options: DBR and ZXing.
//initialize the Dynamsoft Barcode Reader with a license
BarcodeDetectorPolyfill.setDBRLicense("DLS2eyJoYW5kc2hha2VDb2RlIjoiMjAwMDAxLTE2NDk4Mjk3OTI2MzUiLCJvcmdhbml6YXRpb25JRCI6IjIwMDAwMSIsInNlc3Npb25QYXNzd29yZCI6IndTcGR6Vm05WDJrcEQ5YUoifQ==");
await BarcodeDetectorPolyfill.initDBR();
window.BarcodeDetector = BarcodeDetectorPolyfill;
}
barcodeDetector = new window.BarcodeDetector({ formats: ["qr_code"] });
}
async function decode(imgEl) {
//decode an image element
let barcodes = await barcodeDetector.detect(imgEl);
}
You can apply for a license of Dynamsoft Barcode Reader here.
Dynamsoft Barcode Reader:
- Code 11
- Code 39
- Code 93
- Code 128
- Codabar
- EAN-8
- EAN-13
- UPC-A
- UPC-E
- Interleaved 2 of 5 (ITF)
- Industrial 2 of 5 (Code 2 of 5 Industry, Standard 2 of 5, Code 2 of 5)
- ITF-14
- QRCode
- DataMatrix
- PDF417
- GS1 DataBar
- Maxicode
- Micro PDF417
- Micro QR
- PatchCode
- GS1 Composite
- Postal Code
- Dot Code
- Pharmacode
ZXing:
- Aztec
- Code 39
- Code 128
- EAN-8
- EAN-13
- UPC-A
- UPC-E
- QRCode
- DataMatrix
- PDF417
- Interleaved 2 of 5 (ITF)