Table of contents

MRZ Scanner JavaScript Edition - Demo

The Dynamsoft MRZ Scanner Demo is a fully styled, mobile-and-desktop-responsive reference implementation. It pairs the SDK with a branded landing page, a desktop-to-mobile QR-code handoff, and a polished launch flow, all built on the same MRZScanner / launch() API used in the Quick Start and the User Guide.

Source

The full source lives at samples/demo/ in the Dynamsoft/mrz-scanner-javascript repository.

Running the Demo Locally

  1. Clone the repository (or download a ZIP and extract it):

     git clone https://github.com/Dynamsoft/mrz-scanner-javascript.git
    
  2. Move into the demo folder, install dependencies, build, and start the dev server:

     cd mrz-scanner-javascript/samples/demo
     npm install
     npm run build
     npm run dev
    

The dev server prints two URLs: a https://localhost:<port> URL for the host machine, and a https://<lan-ip>:<port> URL for other devices on the same network. Open either, accept the self-signed certificate warning on first visit, and grant camera permission to use the demo.

Live Demo

Try the official Dynamsoft MRZ Scanner demo if you want to see the user flow before cloning.

Walkthrough

For a step-by-step breakdown of how the demo is built, see the Demo Walkthrough. It covers a simpler implementation with the same home and result UI but without the branded landing page, QR-code handoff, or theming layer, designed to drop into your own project.

Next Steps

  • For a step-by-step walkthrough of the SDK API, see the Quick Start.
  • For a full production integration via npm, see the User Guide.
  • To customize the scanner UI, theme, and behavior, see the Customization Guide.

This page is compatible for: