New Case Study:See how Anthropic automated 95% of dependency reviews with Socket.Learn More
Socket
Sign inDemoInstall
Socket

shen-dynamsoft-javascript-codeparser

Package Overview
Dependencies
Maintainers
1
Versions
10
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

shen-dynamsoft-javascript-codeparser

code-parser

  • 0.20220602133639.0
  • latest
  • npm
  • Socket score

Version published
Maintainers
1
Created
Source

layout: default-layout title: Dynamsoft Code Parser for JavaScript - User Guide description: This is the user guide page of Dynamsoft Code Parser for JavaScript SDK. keywords: user guide, javascript breadcrumbText: User Guide noTitleIndex: true needAutoGenerateSidebar: true needGenerateH3Content: true

Dynamsoft Code Parser for Your Website

Dynamsoft Code Parser JavaScript Edition is equipped with industry-leading algorithms for exceptional speed, accuracy in code parsing. With its well-designed API, you can equip your web page with a code parser by just adding a few lines of code. Once integrated, your users can open your website in a browser and parse codes to get readable information.

In this guide, you will learn step by step on how to integrate this library into your website.

Table of Contents

  • Hello World - Simplest Implementation
  • Building your own page
  • API Documentation

Hello World - Simplest Implementation

Let’s start with the "Hello World" example of the library which demonstrates how to use the minimum code to enable a web page to parse codes into readable info.

The complete code of the "Hello World" example is shown below:

Note:

Since the code that needs parsing is usually hard to understand and often comes from images, we choose an online image which contains a US driver license to demonstrate how to parse the code with the help of BarcodeReader. Please make sure your device is Internet-connected when open the following example in browser.

<!DOCTYPE html>
<html>
<body>
    <script src="https://cdn.jsdelivr.net/npm/dynamsoft-javascript-barcode@9.0.2/dist/dbr.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/dynamsoft-javascript-codeparser@1.0.0/dist/dcp.js"></script>
    <script>
        // Specifies a license, you can visit https://www.dynamsoft.com/customer/license/trialLicense?ver=9.0.2&utm_source=guide&product=dbr&package=js to get your own trial license good for 30 days. 
        Dynamsoft.DBR.BarcodeReader.license = 't0068lQAAAAWk9rCg04e7MDgGn4AJN8BhCJrycXMZ/7/QCEJ+ujo4p3Qdrm0yeXgkbvg8pzKp6mHIeMt0zXSzXqCFT1zbi5U=';
        Dynamsoft.DCP.CodeParser.license = 't0068lQAAALYEhtEBvMXXW/PQNyEwn0zwxU2eDrsWWkyVFnHbiQlE6VXULCiJA5B7kAYMJRlKL5N94Wi7R62CEiCgJnJsfNc=';
        // Initializes and uses the library
        (async () => {
            try {
                let reader = await Dynamsoft.DBR.BarcodeReader.createInstance();
                let parser = await Dynamsoft.DCP.CodeParser.createInstance();

                parser.setCodeFormat(Dynamsoft.DCP.EnumCodeFormat.CF_DL_AAMVA_ANSI);

                // decode the driver license with BarcodeReader
                let results = await reader.decode(
                    "https://pic1.zhimg.com/v2-8a34c05de1b63d093ad3e3b9b985b630_r.jpg");

                var info = "";
                for (let result of results) {
                    // input code which is the decoding result in number[] format
                    info = await parser.parseData(result.barcodeBytes);
                    // pop up the readable info
                    alert(JSON.stringify(info));
                    // see the readable info in console
                    console.log(info);
                }
            } catch (ex) {
                alert(ex);
            }
        })();
    </script>
</body>
</html>
About the code
  • license: This property specifies a license key. Note that the DCP license "t0068lQAAALYEhtEBvMXXW/PQNyEwn0zwxU2eDrsWWkyVFnHbiQlE6VXULCiJA5B7kAYMJRlKL5N94Wi7R62CEiCgJnJsfNc=" used in this example is an offline license. Read more on Specify the license.

  • createInstance(): This method creates a CodeParser object.

  • setCodeFormat: This method sets the code’s type before parsing.

  • parseData: This method parses code which could be number[], Uint8Array and string.

Building your own page

Include the library

Use a CDN

The simplest way to include the library is to use either the jsDelivr or UNPKG CDN. The "hello world" example above uses jsDelivr.

  • jsDelivr

    <script src="https://cdn.jsdelivr.net/npm/dynamsoft-javascript-codeparser@1.0.0/dist/dcp.js"></script>
    
  • UNPKG

    <script src="https://unpkg.com/dynamsoft-javascript-codeparser@1.0.0/dist/dcp.js"></script>
    
Host the library yourself

Besides using the CDN, you can also download the library and host its files on your own website / server before including it in your application.

Options to download the library:

  • yarn

    yarn add dynamsoft-javascript-codeparser
    
  • npm

    npm install dynamsoft-javascript-codeparser --save
    

Depending on how you downloaded the library and where you put it, you can typically include it like this:

<script src="/dynamsoft-codeparser-js-1.0.0/dist/dcp.js"></script>

or

<script src="/node_modules/dynamsoft-javascript-codeparser/dist/dcp.js"></script>

Refer to how to host the library.

Configure the library

Before using the library, you need to configure a few things.

Specify the license

The library requires a license to work, use the API license to specify a license key.

Dynamsoft.DCP.CodeParser.license = "YOUR-LICENSE-KEY";

Please Contact us via the customer portal if you want a DCP license.

If you registered a Dynamsoft account and downloaded the library from the official website, Dynamsoft will generate a 30-day trial license for you and put the license key into all the samples that come with the library.

Specify the location of the "engine" files

This is usually only required with frameworks like Angular or React, etc. where dbr.js is compiled into another file.

The purpose is to tell the library where to find the engine files (*.worker.js, *.wasm.js and *.wasm, etc.). The API is called engineResourcePath:

//The following code uses the jsDelivr CDN, feel free to change it to your own location of these files
Dynamsoft.DCP.CodeParser.engineResourcePath = "https://cdn.jsdelivr.net/npm/dynamsoft-javascript-codeparser@1.0.0/dist/";

Interact with the library

Create a CodeParser object

To use the library, we first create a CodeParser object.

Dynamsoft.DCP.CodeParser.license = "YOUR-LICENSE-KEY";
let parser = null;
try {
    parser = await Dynamsoft.DCP.CodeParser.createInstance();
} catch (ex) {
    console.error(ex);
}

Tip: When creating a CodeParser object within a function which may be called more than once, it’s best to use a “helper” variable to avoid double creation such as pParser in the following code

Dynamsoft.DCP.CodeParser.license = "YOUR-LICENSE-KEY";
let pParser = null;
try {
    const parser = await (pParser = pParser || Dynamsoft.DCP.CodeParser.createInstance());
} catch (ex) {
    console.error(ex);
}
Set code format

Before parsing, it’s important to specify what kind of code you want to parse from. See EnumCodeFormat to check if DCP covers the code format you need.

parser.setCodeFormat(format);   //format: EnumCodeFormat
Parse code

The method parseData takes data in three formats: number[], Uint8Array, string. If you want to parse a barcode directly into readable info, you can use BarcodeReader or BarcodeScanner first to get its barcodeBytes and then use CodeParser to parse them.

parser.parseData(data);   //data: number[] | Uint8Array | string
Set encryption key if needed

If the code you want to parse needs a public key or certificate to help parsing, please set it up before calling the parseData() method.

parser.setCryptoPublicKey(key);   //key: string
// or
parser.setCertificate(value);     //value: Uint8Array | ArrayBuffer | string

API Documentation

You can check out the detailed documentation about the APIs of the library at https://www.dynamsoft.com/code-parser/docs/programming/javascript/user-guide/?ver=latest.

FAQs

Package last updated on 02 Jun 2022

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc