Web Demos

BARCODE READER SDK DEMO

Explore the flexibe barcode reading settings to optimize for your specific usage scenario.

WEB TWAIN SDK DEMO

Try the most popular web scanner features: scan images, import local images and PDF files, edit, save to local, upload to database, and etc.

BARCODE READER JAVASCRIPT DEMO

Transform any camera-equipped devices into real-time, browser-based barcode and QR code scanners.

MRZ SCANNER WEB DEMO

Detects the machine-readable zone of a passport, scans the text, and parses into human-readable data.

APP STORE DEMOS

BARCODE READER SDK FOR IOS

BARCODE READER SDK FOR ANDROID

VIEW MORE DEMOS >
Dev Center
Table of contents

Thanks for downloading Dynamsoft Barcode Reader Package!

Your download will start shortly. If your download does not begin, click here to retry.

Javascript API Reference - BarcodeScanner Initialize and Destroy Methods

Method Description
createInstance() Create a BarcodeScanner object.
destroy() Destroy the BarcodeScanner object.
getUIElement() Get HTML element containing the BarcodeScanner object.
setUIElement() Set HTML element containing the BarcodeScanner object.

createInstance

Create a BarcodeScanner object. Overrides BarcodeReader.createInstance.

createInstance(config) returns Promise

Parameters

configoptional any

Return Value

Promise<BarcodeScanner>

test

Sample

let scanner = await Dynamsoft.BarcodeScanner.createInstance();

Read barcodes from live camera

destroy

Destroy the BarcodeScanner object. Equivalent to the previous method deleteInstance(). Overrides BarcodeReader.destroy.

destroy() returns Promise

Return Value

Promise<any>

getUIElement

Get the HTML element containing the BarcodeScanner object.

getUIElement() returns HTMLElement

Return Value

HTMLElement

Sample

Read barcodes from live camera

setUIElement

Set HTML element containing the BarcodeScanner object.

setUIElement(elementOrUrl) returns Promise

Parameters

elementOrUrl *HTMLElement string*

Return Value

Promise<void>

Sample

<!-- Define an element that shows only the video input -->
<!-- The video element will be created and appended to the DIV element with the class dce-video-container , make sure the class name is the same.
Besides, the CSS property position of the DIV element must be either relative, absolute, fixed, or sticky. -->
<div class="dce-video-container" style="position:relative;width:100%;height:500px;"></div>
<script>
    let scanner = await Dynamsoft.DBR.BarcodeScanner.createInstance();
    await scanner.setUIElement(document.getElementsByClassName("dce-video-container")[0]);
    await scanner.open();
</script>

Read barcodes from live camera

:+1: Tips and Tricks

  • This API changes the UI on the fly. If you want the UI to change as soon as the camera is created, use defaultUIElementURL instead.

This page is compatible for:

Version 7.5.0

Is this page helpful?

YesYes NoNo

In this article:

latest version

    • Latest version
    • Version 9.x
      • Version 9.2.12
      • Version 9.0.2
      • Version 9.0.1
      • Version 9.0.0
    • Version 8.x
      • Version 8.8.7
      • Version 8.8.5
      • Version 8.8.3
      • Version 8.8.0
      • Version 8.6.3
      • Version 8.6.0
      • Version 8.4.0
      • Version 8.2.5
      • Version 8.2.3
      • Version 8.2.1
      • Version 8.2.0
      • Version 8.1.3
      • Version 8.1.2
      • Version 8.1.0
      • Version 8.0.0
    • Version 7.x
      • Version 7.6.0
      • Version 7.5.0
    Change +
    © 2003–2023 Dynamsoft. All rights reserved.
    Privacy Statement / Site Map / Home / Purchase / Support