Skip to main content

Quick start for the Web MRZ Scanner Module

In this section, you'll learn how to set up the Scanbot MRZ Scanner Module for Web in your app, with MRZ Scanning enabled, all within 10 minutes – thanks to our Ready-to-Use UI!

Add the dependency​

First, simply add the script tag of the SDK to your HTML file. Make sure to put it before your main script.

<html>
    <head>
        <title>ScanbotSDK Quickstart</title>
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
    </head>
    <body>
        <div id="document-scanner-container" style="width: 100%; height: 100%;"></div>
    </body>
    <script src="https://cdn.jsdelivr.net/npm/scanbot-web-sdk@latest/bundle/ScanbotSDK.ui2.min.js"></script>
    <script src="./main.js"></script>
</html>
warning

CDNs like jsDelivr should only be used for quick prototyping.

For your production environment, please download the SDK and host it on your server.

Initialize the Scanbot SDK​

Since most environments do not allow top-level await, you need to wrap your code in an async function.

(async function() {
    const sdk = await ScanbotSDK.initialize({
        licenseKey: "",
        enginePath: "https://cdn.jsdelivr.net/npm/scanbot-web-sdk@latest/bundle/bin/complete/"
    });
})();

Start the scanner and process the results​

Remember to wrap the scanner creation into the same async block as the initialization.

(async function() {
    // Create default configuration object.
    const config = new ScanbotSDK.UI.Config.MrzScannerScreenConfiguration();
    const result = await ScanbotSDK.UI.createMrzScanner(config);
    result?.mrzDocument?.fields.forEach((field) => {
        // Process resulting fields as needed
        const type = field.type;
        const value = field.value;
    });
})();

🚀 That's it! 🚀 You have successfully integrated a full-featured MRZ scanner as an RTU UI controller into your app.

Want to scan longer than one minute?

Generate a free trial license to test the Scanbot SDK thoroughly.

Get free trial license

On this page