{"id":18696296,"url":"https://github.com/dynamsoft/code-parser-javascript","last_synced_at":"2026-01-26T03:31:39.402Z","repository":{"id":217991440,"uuid":"745302567","full_name":"Dynamsoft/code-parser-javascript","owner":"Dynamsoft","description":null,"archived":false,"fork":false,"pushed_at":"2024-04-10T09:20:11.000Z","size":1676,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":7,"default_branch":"main","last_synced_at":"2025-05-19T00:38:24.934Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":null,"has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"other","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/Dynamsoft.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2024-01-19T03:23:45.000Z","updated_at":"2024-01-19T03:23:45.000Z","dependencies_parsed_at":"2024-01-19T04:29:48.501Z","dependency_job_id":"5c4a8983-4226-4dd5-87ca-e156f1a27b5c","html_url":"https://github.com/Dynamsoft/code-parser-javascript","commit_stats":null,"previous_names":["dynamsoft/code-parser-javascript"],"tags_count":2,"template":false,"template_full_name":null,"purl":"pkg:github/Dynamsoft/code-parser-javascript","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Dynamsoft%2Fcode-parser-javascript","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Dynamsoft%2Fcode-parser-javascript/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Dynamsoft%2Fcode-parser-javascript/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Dynamsoft%2Fcode-parser-javascript/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Dynamsoft","download_url":"https://codeload.github.com/Dynamsoft/code-parser-javascript/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Dynamsoft%2Fcode-parser-javascript/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":28765897,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-01-26T03:19:35.311Z","status":"ssl_error","status_checked_at":"2026-01-26T03:19:13.815Z","response_time":59,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.5:443 state=error: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-11-07T11:17:58.984Z","updated_at":"2026-01-26T03:31:39.382Z","avatar_url":"https://github.com/Dynamsoft.png","language":null,"readme":"# Dynamsoft Code Parser for Your Website\n\nDynamsoft Code Parser is designed to parse data strings (usually encrypted in barcodes, machine readable zones, etc.) into human-readable information. The JavaScript edition is based on WebAssembly and offers great speed and accuracy. With its well-designed API, you can equip your web pages with a code parser with just a few lines of code.\n\nIn this guide, you will learn step by step on how to integrate the SDK into your website.\n\n\u003cspan style=\"font-size:20px\"\u003eTable of Contents\u003c/span\u003e\n\n- [Dynamsoft Code Parser for Your Website](#dynamsoft-code-parser-for-your-website)\n  - [Hello World](#hello-world)\n    - [About the code](#about-the-code)\n    - [Run the example](#run-the-example)\n  - [Building your own page](#building-your-own-page)\n    - [Include the SDK](#include-the-sdk)\n      - [Use a CDN](#use-a-cdn)\n      - [Host the SDK yourself](#host-the-sdk-yourself)\n    - [Configure the SDK](#configure-the-sdk)\n      - [Specify the license](#specify-the-license)\n      - [Specify the location of the \"engine\" files (optional)](#specify-the-location-of-the-engine-files-optional)\n    - [Interact with the SDK](#interact-with-the-sdk)\n      - [Load the specification for parsing](#load-the-specification-for-parsing)\n      - [Create a `CodeParser` object](#create-a-codeparser-object)\n      - [Start Parsing](#start-parsing)\n  - [System requirements](#system-requirements)\n  - [Release notes](#release-notes)\n  - [API Documentation](#api-documentation)\n\n## Hello World\n\nDynamsoft Code Parser is designed to work both independently and alongside another functional product such as [Dynamsoft Barcode Reader](https://www.dynamsoft.com/barcode-reader/overview/) or [Dynamsoft Label Recognizer](https://www.dynamsoft.com/label-recognition/overview/).\n\nLet's start with the \"Hello World\" example of the SDK which demonstrates how to use the minimum code to enable a web page to parse an existing string into human-readable fields.\n\nThe complete code of the \"Hello World\" example is shown below:\n\n```html\n\u003c!DOCTYPE html\u003e\n\u003chtml lang=\"en\"\u003e\n\u003chead\u003e\n    \u003cmeta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\" /\u003e\n    \u003cscript src=\"https://cdn.jsdelivr.net/npm/dynamsoft-core@3.2.10/dist/core.js\"\u003e\u003c/script\u003e\n    \u003cscript src=\"https://cdn.jsdelivr.net/npm/dynamsoft-license@3.2.10/dist/license.js\"\u003e\u003c/script\u003e\n    \u003cscript src=\"https://cdn.jsdelivr.net/npm/dynamsoft-code-parser@2.2.10/dist/dcp.js\"\u003e\u003c/script\u003e\n\u003c/head\u003e\n\u003cbody\u003e\n\u003cdiv\n    id=\"results\"\n    style=\"width: 100%; min-height: 10vh; font-size: 3vh; overflow: auto\"\n\u003e\u003c/div\u003e\n\u003cscript\u003e\n    let passportMRZStr =\n    \"P\u003cD\u003c\u003cADENAUER\u003c\u003cKONRAD\u003cHERMANN\u003cJOSEPH\u003c\u003c\u003c\u003c\u003c\u003c\u003c\u003c1234567897D\u003c\u003c7601059M6704115\u003c\u003c\u003c\u003c\u003c\u003c\u003c\u003c\u003c\u003c\u003c\u003c\u003c\u003c\u003c2\";\n\n    let parser = null;\n    const resultsContainer = document.querySelector(\"#results\");\n    (async function () {\n    Dynamsoft.License.LicenseManager.initLicense(\n        \"DLS2eyJvcmdhbml6YXRpb25JRCI6IjIwMDAwMSJ9\"\n    );\n    await Dynamsoft.DCP.CodeParserModule.loadSpec(\"MRTD_TD3_PASSPORT\");\n    parser = await Dynamsoft.DCP.CodeParser.createInstance();\n\n    let parsedResultItem = await parser.parse(passportMRZStr);\n\n    let parsedResult = JSON.parse(parsedResultItem.jsonString);\n    let parsedLines = parsedResult.ResultInfo;\n    resultsContainer.innerHTML = \"\";\n    parsedLines.forEach((element) =\u003e {\n        resultsContainer.innerHTML +=\n        \"\u003chr\u003e\u003cstrong\u003e\" + element.FieldName + \"\u003c/strong\u003e\u003cbr /\u003e\u003chr\u003e\";\n        element.ChildFields[0].forEach((childElement) =\u003e {\n        resultsContainer.innerHTML +=\n            \"  \" +\n            `${childElement.FieldName}: \u003cstrong\u003e${childElement.Value}\u003c/strong\u003e\u003cbr /\u003e`;\n        });\n    });\n    })();\n\u003c/script\u003e\n\u003c/body\u003e\n\u003c/html\u003e\n\n```\n\n### About the code\n\n- `let passportMRZStr = \"P\u003cD\u003c\u003cADENAUER\u003c\u003cKONRAD\u003cHERMANN\u003cJOSEPH\u003c\u003c\u003c\u003c\u003c\u003c\u003c\u003c1234567897D\u003c\u003c7601059M6704115\u003c\u003c\u003c\u003c\u003c\u003c\u003c\u003c\u003c\u003c\u003c\u003c\u003c\u003c\u003c2\";`: this string is a fabricated example that conforms to the `MRTD_TD3_PASSPORT` specification. In a practical scenario, such a string would be provided by an external software. For instance, it could be the textual output of \"Dynamsoft Label Recognizer\" following the scanning of a passport.\n\n- `Dynamsoft.License.LicenseManager.initLicense()`: initializes the license using a license key string.\n\n- `Dynamsoft.DCP.CodeParserModule.loadSpec(\"MRTD_TD3_PASSPORT\")`: preloads the `MRTD_TD3_PASSPORT` specification which helps with the parsing of the string.\n\n- `Dynamsoft.DCP.CodeParser.createInstance()`: initializes the `parser` variable by creating an instance of the `CodeParser` class.\n\n- `parser.parse(passportMRZStr)`: parses the sample string and returns a structured result item.\n\n### Run the example\n\nCreate a text file called \"code-parser.html\", fill it with the code above and save it. After that, open the example page in your browser, and you will see the parsed result displayed on the page.\n\n\u003e NOTE:\n\u003e \n\u003e The sample code requires the following to run:\n\u003e \n\u003e 1. Internet connection\n\u003e 2. [A supported browser](#system-requirements)\n\nPlease note:\n\n- Although the page should work properly when opened directly as a file (\"file:///\"), it's recommended that you deploy it to a web server and access it via HTTPS.\n- On first use, you need to wait a few seconds for the SDK to initialize.\n- The license \"DLS2eyJvcmdhbml6YXRpb25JRCI6IjIwMDAwMSJ9\" used in this sample is an online license good for 24 hours and requires network connection to work. To test the SDK further, you can request a 30-day trial license via the [customer portal](https://www.dynamsoft.com/customer/license/trialLicense?utm_source=github\u0026architecture=dcv\u0026product=dcp\u0026package=js).\n\nIf the test doesn't go as expected, you can [contact us](https://www.dynamsoft.com/company/customer-service/#contact).\n\n## Building your own page\n\n### Include the SDK\n\n#### Use a CDN\n\nThe simplest way to include the SDK is to use either the [jsDelivr](https://jsdelivr.com/) or [UNPKG](https://unpkg.com/) CDN. The \"hello world\" example above uses **jsDelivr**.\n\n* jsDelivr\n\n    ```html\n    \u003cscript src=\"https://cdn.jsdelivr.net/npm/dynamsoft-core@3.2.10/dist/core.js\"\u003e\u003c/script\u003e\n    \u003cscript src=\"https://cdn.jsdelivr.net/npm/dynamsoft-license@3.2.10/dist/license.js\"\u003e\u003c/script\u003e\n    \u003cscript src=\"https://cdn.jsdelivr.net/npm/dynamsoft-code-parser@2.2.10/dist/dcp.js\"\u003e\u003c/script\u003e\n    ```\n\n* UNPKG  \n\n    ```html\n    \u003cscript src=\"https://unpkg.com/dynamsoft-core@3.2.10/dist/core.js\"\u003e\u003c/script\u003e\n    \u003cscript src=\"https://unpkg.com/dynamsoft-license@3.2.10/dist/license.js\"\u003e\u003c/script\u003e\n    \u003cscript src=\"https://unpkg.com/dynamsoft-code-parser@2.2.10/dist/dcp.js\"\u003e\u003c/script\u003e\n    ```\n\n#### Host the SDK yourself\n\nBesides using the CDN, you can also download the SDK and host its files on your own website / server before including it in your application.\n\nOptions to download the SDK:\n\n- From the website\n\n  Sign in the [Customer Portal](https://www.dynamsoft.com/customer/index?utm_source=docs\u0026product=dcp) and Download the JavaScript ZIP package\n\n* yarn\n\n    ```cmd\n    yarn add dynamsoft-core@3.2.10 --save\n    yarn add dynamsoft-license@3.2.10 --save\n    yarn add dynamsoft-code-parser@2.2.10 --save\n    ```\n\n* npm\n\n    ```cmd\n    npm install dynamsoft-core@3.2.10 --save\n    npm install dynamsoft-license@3.2.10 --save\n    npm install dynamsoft-code-parser@2.2.10 --save\n    ```\n\nDepending on how you downloaded the SDK and where you put it, you can typically include it like this:\n\n```html\n\u003c!-- Upon extracting the zip package into your project, you can generally include it in the following manner --\u003e\n\u003cscript src=\"./dynamsoft/distributables/dynamsoft-core@3.2.10/dist/core.js\"\u003e\u003c/script\u003e\n\u003cscript src=\"./dynamsoft/distributables/dynamsoft-license@3.2.10/dist/license.js\"\u003e\u003c/script\u003e\n\u003cscript src=\"./dynamsoft/distributables/dynamsoft-code-parser@2.2.10/dist/dcp.js\"\u003e\u003c/script\u003e\n```\n\nor\n\n```html\n\u003cscript src=\"./node_modules/dynamsoft-core/dist/core.js\"\u003e\u003c/script\u003e\n\u003cscript src=\"./node_modules/dynamsoft-license/dist/license.js\"\u003e\u003c/script\u003e\n\u003cscript src=\"./node_modules/dynamsoft-code-parser/dist/dcp.js\"\u003e\u003c/script\u003e\n```\n\nor\n\n```typescript\nimport { LicenseManager } from \"dynamsoft-license\";\nimport { type ParsedResultItem, CodeParser } from 'dynamsoft-code-parser';\n```\n\n### Configure the SDK\n\nBefore using the SDK, you need to configure a few things.\n\n#### Specify the license\n\nThe SDK requires a license to work, use the method `Dynamsoft.License.LicenseManager.initLicense` to specify the license key.\n\n```javascript\n//You can visit https://www.dynamsoft.com/customer/license/trialLicense?utm_source=github\u0026product=dcp\u0026package=js to get your own trial license good for 30 days. \nDynamsoft.License.LicenseManager.initLicense(\"YOUR-LICENSE-KEY\");\n```\n\n#### Specify the location of the \"engine\" files (optional)\n\nThis is usually only required with frameworks like Angular or React, etc. where the referenced JavaScript files such as `core.js`, `dcp.js` are compiled into another file.\n\nThe purpose is to tell the SDK where to find the engine files (\\*.worker.js, \\*.wasm.js and \\*.wasm, etc.). The API is called `Dynamsoft.Core.CoreModule.engineResourcePaths`:\n\n```javascript\n//The following code uses the jsDelivr CDN, feel free to change it to your own location of these files\nDynamsoft.Core.CoreModule.engineResourcePaths.core = \"https://cdn.jsdelivr.net/npm/dynamsoft-core@3.2.10/dist/\";\nDynamsoft.Core.CoreModule.engineResourcePaths.license = \"https://cdn.jsdelivr.net/npm/dynamsoft-license@3.2.10/dist/\";\nDynamsoft.Core.CoreModule.engineResourcePaths.dcp = \"https://cdn.jsdelivr.net/npm/dynamsoft-code-parser@2.2.10/dist/\";\n```\n\n### Interact with the SDK\n\n#### Load the specification for parsing\n\nThe SDK requires the specification of the code string to parse it. If we are going to parse the MRZ strings found on passports, we need the specification \"MRTD\\_TD3\\_PASSPORT\". \n\n```javascript\nawait Dynamsoft.DCP.CodeParserModule.loadSpec(\"MRTD_TD3_PASSPORT\");\n```\n\n#### Create a `CodeParser` object\n\nThen we create a `CodeParser` object.\n\n```javascript\nlet parser = null;\ntry {\n    parser = await Dynamsoft.DCP.CodeParser.createInstance();\n} catch (ex) {\n    console.error(ex);\n}\n```\n\nTip: 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 `helperParser` in the following code\n\n```javascript\nlet helperParser = null;\n\nfunction foo() {\n    try {\n        const parser = await (helperParser = helperParser || Dynamsoft.DCP.CodeParser.createInstance());\n    } catch (ex) {\n        console.error(ex);\n    }\n}\n```\n\n#### Start Parsing\n\nThe method `parse()` takes data in two formats: `Uint8Array` and `string`. `Uint8Array` refers to the binary data produced by another software such as Dynamsoft Barcode Reader.\n\n```javascript\nlet parsedResultItem = await parser.parse(\"THE-CODE-TO-PARSE\");\n```\n\n## System requirements\n\nThe SDK requires the following features to work:\n\n- Secure context (HTTPS deployment)\n\n  When deploying your application / website for production, make sure to serve it via a secure HTTPS connection. This is required because Dynamsoft License requires a secure context to work.\n\n- `WebAssembly`, `Blob`, `URL`/`createObjectURL`, `Web Workers`\n\n  The above four features are required for the SDK to work.\n\nThe following table is a list of supported browsers based on the above requirements:\n\n  | Browser Name | Version |\n  | :----------: | :-----: |\n  |    Chrome    |  v78+   |\n  |   Firefox    |  v62+   |\n  |    Safari    |  v14+   |\n  |     Edge     |  v79+   |\n\nApart from the browsers, the operating systems may impose some limitations of their own that could restrict the use of the SDK.\n\n## Release notes\n\nLearn what are included in each release at [Dynamsoft Code Parser JavaScript Edition Release Notes](https://www.dynamsoft.com/code-parser/docs/web/programming/javascript/release-notes/?ver=latest).\n\n## API Documentation\n\nFor more information about the APIs of the SDK, read [Dynamsoft Code Parser JavaScript Edition API Reference](https://www.dynamsoft.com/code-parser/docs/web/programming/javascript/api-reference/?ver=2.0.20).\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdynamsoft%2Fcode-parser-javascript","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fdynamsoft%2Fcode-parser-javascript","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdynamsoft%2Fcode-parser-javascript/lists"}