JavaScript Barcode Scanner

Das Scanbot Web Barcode Scanner SDK ist als npm-Paket verfügbar und kann auch via jsdelivr geladen werden.

Nach der Installation fügen Sie Ihrer HTM-Datei zunächst ein Container-Element hinzu:

<div id="barcode-scanner-container"></div>

Anschließend können Sie den JavaScript Barcode Scanner einfach in Ihrer JavaScript-App starten:

var barcodeScanner = await scanbotSDK.createBarcodeScanner({
				containerId: 'barcode-scanner-container',
				onBarcodesDetected: onBarcodesDetected,
			});
		

Sie können die zu scannenden 1D- und 2D-Barcodes selbst konfigurieren:

var barcodeScanner = await scanbotSDK.createBarcodeScanner({
	    containerId: 'barcode-scanner-container',
	    …
	    barcodeFormats: [
	      "AZTEC",
	      "CODABAR",
	      "CODE_39",
	      "CODE_93",
	      "CODE_128",
	      "DATA_MATRIX",
	      "EAN_8",
	      "EAN_13",
	      "ITF",
	      "MAXICODE",
	      "PDF_417",
	      "QR_CODE",
	      "RSS_14",
	      "RSS_EXPANDED",
	      "UPC_A",
	      "UPC_E",
	      "UPC_EAN_EXTENSION",
	      "MSI_PLESSEY",
	    ]
	  });
	

Außerdem können Sie das Aussehen Ihres JavaScript Barcode-Scanners individuell anpassen:

var barcodeScanner = await scanbotSDK.createBarcodeScanner({
	    containerId: 'barcode-scanner-container',
	    …
	    style: {
	      window: {
	        aspectRatio: 1,
	        paddingPropLeft: 0.5,
	        borderColor: "white",
	        left: "50%",
	        top: "50%",
	        transform: "translate(-50%, -50%)"
	      },
	      text: {
	        color: "white",
	        size: "0.9em",
	        weight: 300,
	      },
	      backgroundColor: "rgba(0, 0, 0, 0.7)",
	      hint: "Please align the barcode or QR code in the frame"
	    }
	  });
	

Vollständige Beispielprojekte

Wenn Sie sofort loslegen möchten, werfen Sie gerne einen Blick auf unser GitHub-Repository. Dort finden Sie Beispielprojekte zu React, Angular und Plain JavaScript: https://github.com/doo/scanbot-sdk-example-web/

Sie veranschaulichen die Integrationen sämtlicher API-Methoden des Scanbot Web Document Scanner und des Barcode Scanner SDK, darunter der 1D- und 2D-Barcode-Scanner, der Dokumentenscanner, die Benutzeroberfläche zum Zuschneiden von Aufnahmen, Bildfilter, PDF- und TIFF-Rendering und das Scannen von maschinenlesbaren Zonen (MRZ).