barKoder Web SDK - Installation

Requirements #

WebAssembly is a type of code that can be run in modern web browsers — it is a low-level assembly-like language with a compact binary format that runs with near-native performance and is designed to run alongside JavaScript.

The following requirements need to be met:

Client: Chrome 67+, Firefox 69+, Edge 79+, Safari 14+, iOS Safari 14+
Camera usage permission (if using startScanner)
Server: HTTPS, MIME type for WASM files

Install #

                npm install barkoder-wasm

Install Manually #

If you would like to install from a local folder you will need to follow these steps:

Download zip (get it here)
Unpack zip file
Rename folder to your liking
Paste the folder in app directory i.e. myApp/barkoder-wasm (this is the new name of the download module folder)
Finally in your cli (within your app's directory):

                npm install "./barkoder-wasm"

Using the SDK #

Browser #

Copy both barkoder-umd.js and barkoder.wasm to your page's directory.

Include the barkoder-umd.js script:

                <script type="text/javascript" src="barkoder-umd.js"></script>

CommonJS #

Copy barkoder.wasm to your page's directory (i.e. dist).

Require the UMD Module:

                var BarkoderSDK = require('barkoder-wasm');

Then - in your js file:

                async function barkoderInit () {
    var Barkoder = await BarkoderSDK.initialize("your_license_key_here");

    //enable symbologies you'd like to scan
    Barkoder.setEnabledDecoders(
        Barkoder.constants.Decoders.QR,
        Barkoder.constants.Decoders.Ean8,
        Barkoder.constants.Decoders.PDF417
    );

    //change any additional settings
    Barkoder.setCameraResolution(Barkoder.constants.CameraResolution.FHD);
    Barkoder.setDecodingSpeed(Barkoder.constants.DecodingSpeed.Normal);
}

barkoderInit(); //using await requires an async method

In your HTML file add a div with barkoder-container id:

                <div id="barkoder-container" style="width: 500px; height: 300px;"></div>

Additionally add style for size, position, background color, etc.

Note that the container element needs to have a defined size, otherwise the SDK will set half the window size as fallback.

Finally, you are ready to scan:

                let callbackMethod = (result) => alert(`${result.barcodeTypeName}\n${result.textualData}`);

Barkoder.startScanner(callbackMethod);
Barkoder.stopScanner();

Barkoder.scanImage('test.png', callbackMethod);

Activated symbologies #

Often missed part of the configuration setup is actually enabling the symbologies that we want to detect with our scanner. Make sure you have them enabled:

                //enable symbologies you'd like to scan
  Barkoder.setEnabledDecoders(
      Barkoder.constants.Decoders.QR,
      Barkoder.constants.Decoders.Ean8,
      Barkoder.constants.Decoders.PDF417
  );

Here's a list of all available symbologies: https://barkoder.com/docs/v1/barkoder-web-sdk/web-sdk-for-barkoder-api-reference#decoders

                Barkoder.constants.Decoders.Aztec               //: 0,
Barkoder.constants.Decoders.AztecCompact        //: 1,
Barkoder.constants.Decoders.QR                  //: 2,
Barkoder.constants.Decoders.QRMicro             //: 3,
Barkoder.constants.Decoders.Code128             //: 4,
Barkoder.constants.Decoders.Code93              //: 5,
Barkoder.constants.Decoders.Code39              //: 6,
Barkoder.constants.Decoders.Codabar             //: 7,
Barkoder.constants.Decoders.Code11              //: 8,
Barkoder.constants.Decoders.Msi                 //: 9,
Barkoder.constants.Decoders.UpcA                //: 10,
Barkoder.constants.Decoders.UpcE                //: 11,
Barkoder.constants.Decoders.UpcE1               //: 12,
Barkoder.constants.Decoders.Ean13               //: 13,
Barkoder.constants.Decoders.Ean8                //: 14,
Barkoder.constants.Decoders.PDF417              //: 15,
Barkoder.constants.Decoders.PDF417Micro         //: 16,
Barkoder.constants.Decoders.Datamatrix          //: 17,
Barkoder.constants.Decoders.Code25              //: 18,
Barkoder.constants.Decoders.Interleaved25       //: 19,
Barkoder.constants.Decoders.ITF14               //: 20,
Barkoder.constants.Decoders.IATA25              //: 21,
Barkoder.constants.Decoders.Matrix25            //: 22,
Barkoder.constants.Decoders.Datalogic25         //: 23,
Barkoder.constants.Decoders.COOP25              //: 24,
Barkoder.constants.Decoders.Code32              //: 25,
Barkoder.constants.Decoders.Telepen             //: 26,
Barkoder.constants.Decoders.Dotcode             //: 27,
Barkoder.constants.Decoders.Databar14           //: 29,
Barkoder.constants.Decoders.DatabarLimited      //: 30,
Barkoder.constants.Decoders.DatabarExpanded     //: 31,
Barkoder.constants.Decoders.PostalIMB           //: 32,
Barkoder.constants.Decoders.Postnet             //: 33,
Barkoder.constants.Decoders.Planet              //: 34,
Barkoder.constants.Decoders.AustralianPost      //: 35,
Barkoder.constants.Decoders.RoyalMail           //: 36,
Barkoder.constants.Decoders.KIX                 //: 37,
Barkoder.constants.Decoders.JapanesePost        //: 38
Barkoder.constants.Decoders.MaxiCode            //: 39

Trial License #

The SDK will scan barcodes even without a license, but results will come with an "UNLICENSED" prefix.

If you want to test the SDK today create a trial license after registering on the barKoder Developer Portal or request a quote at https://barkoder.com/request-quote.

Note that a trial license is only supposed to be utilized in a development or staging environment.

Free Developer Support #

Our support is completely free for integration or testing purposes and granted through the barKoder Portal. After registering and logging into your account, you only need to submit a Support Ticket via the free ticketing service. Alternatively, you can contact us by email via support@barkoder.com.

Web SDK Examples