Merge pull request #486 from dynamsoft-docs/preview

Justin-dynamsoft · web-flow · commit 4d3d32f84167 · 2026-01-26T13:14:04.000+08:00
Add examples for scanning single and multiple barcodes in the user guide
diff --git a/programming/javascript/user-guide/barcode-scanner.md b/programming/javascript/user-guide/barcode-scanner.md
@@ -64,6 +64,8 @@ When getting started with Barcode Scanner, we recommend getting your own 30-day
 
 ## Quick Start: Hello World Example
 
+Scan One Single Barcode via Camera
+
 ```html
 <!DOCTYPE html>
 <html lang="en">
@@ -102,6 +104,39 @@ When getting started with Barcode Scanner, we recommend getting your own 30-day
   </a>
 </p>
 
+Scan Multiple Barcodes Continuously
+
+```html
+<!DOCTYPE html>
+<html lang="en">
+  <body>
+    <script src="https://cdn.jsdelivr.net/npm/dynamsoft-barcode-reader-bundle@11.2.4000/dist/dbr.bundle.js"></script>
+    <script>
+      // Initialize the Dynamsoft Barcode Scanner
+      const barcodeScanner = new Dynamsoft.BarcodeScanner({
+        // Please don't forget to replace YOUR_LICENSE_KEY_HERE
+        license: "YOUR_LICENSE_KEY_HERE",
+        scanMode: Dynamsoft.EnumScanMode.SM_MULTI_UNIQUE,
+      });
+      (async () => {
+        // Launch the scanner and wait for the result
+        const result = await barcodeScanner.launch();
+        if (result.barcodeResults.length) {
+            // Log the full result object to the console for debugging or further processing
+            console.log(result);
+        }
+      })();
+    </script>
+  </body>
+</html>
+```
+
+<p align="center" style="text-align:center; white-space: normal; ">
+  <a target="_blank" href="https://jsfiddle.net/DynamsoftTeam/d6comprf/" title="Run via JSFiddle" style="text-decoration:none;">
+    <img src="https://cdn.jsdelivr.net/npm/simple-icons@3.0.1/icons/jsfiddle.svg" alt="Run via JSFiddle" width="20" height="20" style="width:20px;height:20px;" >
+  </a>
+</p>
+
 ### Step 1: Setting up the HTML and Including the Barcode Scanner
 
 As outlined earlier, this guide will help you create a simple Hello World barcode scanning application using vanilla JavaScript. The full sample code is also available in the [GitHub repository](https://github.com/Dynamsoft/barcode-reader-javascript-samples/tree/main).
@@ -202,6 +237,12 @@ This is the **simplest** way to initialize the Barcode Scanner. The configuratio
 const barcodeScanner = new Dynamsoft.BarcodeScanner({
   license: "YOUR_LICENSE_KEY_HERE",
   scanMode: Dynamsoft.EnumScanMode.SM_MULTI_UNIQUE,
+  // onUniqueBarcodeScanned: (result) => {
+  //   console.log("Scanned barcode: ", result.text);
+  //   if (condition) { // You can add custom logic here to handle each scanned barcode
+  //     barcodeScanner.dispose(); // Stop scanning
+  //   }
+  // },
 });
 ```
 
