Barcode Scanning Examples

Complete examples for barcode scanning with the Anyline Web SDK.

Single Barcode Scanning

Scan a single barcode with fast process mode with custom configuration:

import { init } from '@anyline/anyline-js';

const anyline = init({
  license: 'YOUR_LICENSE_KEY',
  element: document.getElementById('scanner-root'),
  config: {
    barcodeConfig: {
      barcodeFormats: ['QR_CODE', 'EAN_13', 'CODE_128'],
      multiBarcode: false,
      fastProcessMode: true  // Enable Barcode:AI for better performance
    },
    cancelOnResult: true
  }
});

anyline.onResult = ({ result }) => {
  const barcode = result.barcodeResult.barcodes?.[0];
  if (!barcode) return;

  console.log('Format:', barcode.format);
  console.log('Value:', barcode.value);
};

anyline.startScanning();

  • When using fastProcessMode, result frame is returned in grayscale

  • fastProcessMode cannot be used with Composite Scanning

Multiple Barcode Scanning

Scan multiple barcodes simultaneously with debouncing:

import { init } from '@anyline/anyline-js';

const anyline = init({
  license: 'YOUR_LICENSE_KEY',
  element: document.getElementById('scanner-root'),
  preset: 'all_barcode_formats'  // Scans all supported formats
});

const seen = new Set<string>();

anyline.onResult = ({ result }) => {
  result.barcodeResult.barcodes?.forEach((barcode) => {
    if (seen.has(barcode.value)) return;
    seen.add(barcode.value);
    console.log(`New barcode (${barcode.format}):`, barcode.value);
  });
};

anyline.startScanning();

Available barcode presets:

  • qr - QR code scanning

  • barcode_pdf417 - PDF417 barcode scanning

  • barcode_pdf417_parsed - PDF417 with AAMVA parsing for driver’s licenses

  • all_barcode_formats - All supported formats with multi-barcode

  • legacy_barcode - Legacy barcode engine

Parse AAMVA Driver’s Licenses

Extract structured data from US driver’s licenses:

import { init } from '@anyline/anyline-js';

const anyline = init({
  license: 'YOUR_LICENSE_KEY',
  element: document.getElementById('scanner-root'),
  preset: 'barcode_pdf417_parsed'  // PDF417 with AAMVA parsing
});

anyline.onResult = ({ result }) => {
  const barcode = result.barcodeResult.barcodes?.[0];
  if (!barcode) return;

  // AAMVA payload lives under the "body-part" node
  const aamva = barcode.aamva?.['body-part'];

  if (aamva) {
    console.log('First Name:', aamva.firstName);
    console.log('Last Name:', aamva.lastName);
    console.log('Date of Birth:', aamva.dateOfBirth);
    console.log('License Number:', aamva.customerIDNumber);
    console.log('Address:', `${aamva.street}, ${aamva.city}, ${aamva.jurisdictionCode} ${aamva.postalCode}`);
  } else {
    console.log('Raw barcode value:', barcode.value);
  }
};

anyline.startScanning();

Inventory Scanning

Scan and track multiple items with filtering:

import { init } from '@anyline/anyline-js';

const anyline = init({
  license: 'YOUR_LICENSE_KEY',
  element: document.getElementById('scanner-root'),
  config: {
    barcodeConfig: {
      barcodeFormats: ['EAN_13', 'EAN_8', 'UPC_A', 'CODE_128'],
      multiBarcode: true,
      fastProcessMode: true
    },
    consecutiveEqualResultFilter: 3000  // Don't scan same barcode within 3 seconds
  }
});

const inventory: Map<string, number> = new Map();

anyline.onResult = ({ result }) => {
  result.barcodeResult.barcodes?.forEach((barcode) => {
    const count = inventory.get(barcode.value) || 0;
    inventory.set(barcode.value, count + 1);

    console.log(`${barcode.value}: ${count + 1} items`);
    updateInventoryDisplay();
  });
};

function updateInventoryDisplay() {
  const list = document.getElementById('inventory-list');
  if (list) {
    list.innerHTML = Array.from(inventory.entries())
      .map(([barcode, count]) => `<li>${barcode}: ${count}</li>`)
      .join('');
  }
}

anyline.startScanning();

Filter options for consecutiveEqualResultFilter:

  • -1: Don’t report equal results until scanning stops

  • 0: Report every equal result

  • > 0: Milliseconds to wait before detecting the same result again

Configuration Reference

For detailed information about all configuration parameters including barcodeConfig, supported formats, and their default values, see Barcode Technical Capabilities.

Result Structure

For the complete result structure, see the Plugin Result JSON Schema.

See Also