{"id":24343244,"url":"https://github.com/undecaf/barcode-detector-polyfill","last_synced_at":"2025-05-16T05:00:15.626Z","repository":{"id":41387175,"uuid":"443580479","full_name":"undecaf/barcode-detector-polyfill","owner":"undecaf","description":"A WebAssembly polyfill for the Barcode Detection API","archived":false,"fork":false,"pushed_at":"2025-03-10T22:24:37.000Z","size":608,"stargazers_count":140,"open_issues_count":0,"forks_count":15,"subscribers_count":3,"default_branch":"master","last_synced_at":"2025-05-12T13:54:03.300Z","etag":null,"topics":["barcode-scanner","barcodedetector","polyfill","qrcode-scanner","wasm","webasssembly","zbar"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/undecaf.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":"2022-01-01T16:44:22.000Z","updated_at":"2025-05-03T18:12:36.000Z","dependencies_parsed_at":"2024-08-03T08:22:34.045Z","dependency_job_id":"0913b17a-c662-48fe-9e02-0669cb178aba","html_url":"https://github.com/undecaf/barcode-detector-polyfill","commit_stats":{"total_commits":34,"total_committers":5,"mean_commits":6.8,"dds":"0.17647058823529416","last_synced_commit":"91403471bf71b2f7a822f24fa9a249bba306f7a0"},"previous_names":[],"tags_count":16,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/undecaf%2Fbarcode-detector-polyfill","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/undecaf%2Fbarcode-detector-polyfill/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/undecaf%2Fbarcode-detector-polyfill/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/undecaf%2Fbarcode-detector-polyfill/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/undecaf","download_url":"https://codeload.github.com/undecaf/barcode-detector-polyfill/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":254471028,"owners_count":22076582,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","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":["barcode-scanner","barcodedetector","polyfill","qrcode-scanner","wasm","webasssembly","zbar"],"created_at":"2025-01-18T08:20:08.661Z","updated_at":"2025-05-16T05:00:15.514Z","avatar_url":"https://github.com/undecaf.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# A WebAssembly polyfill for the Barcode Detection API\n\n![Minified size](https://badgen.net/packagephobia/install/@undecaf/barcode-detector-polyfill?color=42cc24)\n![Open issues](https://badgen.net/github/open-issues/undecaf/barcode-detector-polyfill)\n![Vulnerabilities](https://snyk.io/test/npm/@undecaf/barcode-detector-polyfill/badge.svg)\n![Total downloads](https://badgen.net/npm/dt/@undecaf/barcode-detector-polyfill)\n[![](https://badgen.net/jsdelivr/hits/npm/@undecaf/barcode-detector-polyfill)](https://www.jsdelivr.com/package/npm/@undecaf/barcode-detector-polyfill)\n![License](https://badgen.net/github/license/undecaf/barcode-detector-polyfill)\n\nThis package polyfills the [Barcode Detection API](https://developer.mozilla.org/en-US/docs/Web/API/Barcode_Detection_API) for browsers,\nusing a [WebAssembly build](https://github.com/undecaf/zbar-wasm#readme) of the \n[ZBar Bar Code Reader](https://github.com/mchehab/zbar#readme) that is written in C/C++.\nIt offers the following features:\n\n+ Polyfills the [BarcodeDetector](https://developer.mozilla.org/en-US/docs/Web/API/BarcodeDetector) class\n+ Supports these barcode formats: `codabar`, `code_39`, `code_93`, `code_128`, `databar`, `databar_exp`, `ean_2`, `ean_5`, \n  `ean_8`, `ean_13`, `ean_13+2`, `ean_13+5`, `isbn_10`, `isbn_13`, `isbn_13+2`, `isbn_13+5`, `itf`,\n  `qr_code`, `sq_code`, `upc_a`, `upc_e`\n+ Not supported: `aztec`, `data_matrix`, `pdf417`\n+ Scans `\u003cimg\u003e`, `\u003ccanvas\u003e` and live `\u003cvideo\u003e` elements, image and video `Blob`s and `File`s and more\n+ Detects multiple barcodes per frame, also with different types\n+ Barcodes may be oriented horizontally or vertically\n+ Outperforms pure JavaScript polyfills\n\nAn online example is available [on GitHub](https://undecaf.github.io/barcode-detector-polyfill/example-loaded/)\n([source code](https://github.com/undecaf/barcode-detector-polyfill/tree/master/example-loaded) with build scripts for Rollup and esbuild)\nand [on CodePen](https://codepen.io/undecaf/pen/LYzXXzg).\n\n\n## Polyfilling `BarcodeDetector`\n\n### In an ES module\n\nInstall:\n\n```shell\n$ npm install @undecaf/barcode-detector-polyfill\n    or\n$ yarn add @undecaf/barcode-detector-polyfill\n```\n\nMake the polyfill available if necessary:\n\n```javascript\nimport { BarcodeDetectorPolyfill } from '@undecaf/barcode-detector-polyfill'\n\ntry {\n    window['BarcodeDetector'].getSupportedFormats()\n} catch {\n    window['BarcodeDetector'] = BarcodeDetectorPolyfill\n}\n    ⁝\n```\n\nDetailed examples are available [here](https://undecaf.github.io/barcode-detector-polyfill/example-loaded/)\n([source code](https://github.com/undecaf/barcode-detector-polyfill/tree/master/docs/example-loaded))\nand  [here](https://undecaf.github.io/barcode-detector-polyfill/example-bundled/)\n([source code](https://github.com/undecaf/barcode-detector-polyfill/tree/master/docs/example-bundled)).\n\n\n### In a `\u003cscript type=\"module\"\u003e`\n\nImport the `BarcodeDetectorPolyfill` API:\n\n```html\n\u003cscript type=\"module\"\u003e\n    import { BarcodeDetectorPolyfill } from \"https://cdn.jsdelivr.net/npm/@undecaf/barcode-detector-polyfill@0.9.21/dist/main.js\";\n\n    try {\n        window['BarcodeDetector'].getSupportedFormats()\n    } catch {\n        window['BarcodeDetector'] = BarcodeDetectorPolyfill\n    }\n      ⁝\n\u003c/script\u003e\n```\n\nA detailed example is available [here](https://undecaf.github.io/barcode-detector-polyfill/example-module/index.html)\n([source code](https://github.com/undecaf/barcode-detector-polyfill/tree/master/docs/example-module)).\n\n\n### In a plain `\u003cscript\u003e`\n\nExpose the `BarcodeDetectorPolyfill` API in variable `barcodeDetectorPolyfill`:\n\n```html\n\u003cscript src=\"https://cdn.jsdelivr.net/npm/@undecaf/zbar-wasm@0.9.15/dist/index.js\"\u003e\u003c/script\u003e\n\u003cscript src=\"https://cdn.jsdelivr.net/npm/@undecaf/barcode-detector-polyfill@0.9.21/dist/index.js\"\u003e\u003c/script\u003e\n\u003cscript\u003e\n    try {\n        window['BarcodeDetector'].getSupportedFormats()\n    } catch {\n        window['BarcodeDetector'] = barcodeDetectorPolyfill.BarcodeDetectorPolyfill\n    }\n      ⁝\n\u003c/script\u003e\n```\n\nA detailed example is available [here](https://undecaf.github.io/barcode-detector-polyfill/example-script/index.html)\n([source code](https://github.com/undecaf/barcode-detector-polyfill/tree/master/docs/example-script)).\n\n\n## Using `BarcodeDetector`/`BarcodeDetectorPolyfill`\n\n### Querying the supported barcode formats\n\n```javascript\nconst formats = await BarcodeDetector.getSupportedFormats()\n```\n\n\n### Setting up a `BarcodeDetector` instance\n\n```javascript\nconst detector = new BarcodeDetector({ formats: ['code_39', 'code_128', 'ean_13'] })\n```\n\nIf `formats` is omitted then all supported formats will be detected.\n\n\u003ca name=\"encoding\"\u003e\u003c/a\u003e\nWhere applicable (e.g. format `'qr_code'`), text is assumed to be UTF-8 encoded. As an extension to the\n`BarcodeDetector` API, a different encoding can be set for the `BarcodeDetectorPolyfill`:\n\n```javascript\nconst detector = new BarcodeDetectorPolyfill({ \n  formats: ['qr_code'],\n  zbar: {\n      encoding: 'iso-8859-15'\n  }\n})\n```\n\n`encoding` may be any of the [Encoding API encodings](https://developer.mozilla.org/en-US/docs/Web/API/Encoding_API/Encodings).\n\n\n### Detecting barcodes\n\n```javascript\nconst barcodes = await detector.detect(source)\n```\n\n`source` must be an object of which an [`ImageBitmap`](https://developer.mozilla.org/en-US/docs/Web/API/ImageBitmap)\ncan be obtained, or else a \n[`TypeError`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/TypeError)\nwill be thrown:\n\n+ an `\u003cimg\u003e` element ([`HTMLImageElement`](https://developer.mozilla.org/en-US/docs/Web/API/HTMLImageElement))\n+ a `\u003cvideo\u003e` element ([`HTMLVideoElement`](https://developer.mozilla.org/en-US/docs/Web/API/HTMLVideoElement))\n  from which a single frame will be taken\n+ a `\u003ccanvas\u003e` element ([`HTMLCanvasElement`](https://developer.mozilla.org/en-US/docs/Web/API/HTMLCanvasElement))\n+ an [`ImageBitmap`](https://developer.mozilla.org/en-US/docs/Web/API/ImageBitmap)\n+ an [`ImageData`](https://developer.mozilla.org/en-US/docs/Web/API/ImageData) instance\n+ a [`CanvasRenderingContext2D`](https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D)\n+ a [`Blob`](https://developer.mozilla.org/en-US/docs/Web/API/Blob) or a \n  [`File`](https://developer.mozilla.org/en-US/docs/Web/API/File) with a content `type` of `image/*`\n\nIn addition, any object with a zero `width` or `height` property will be tolerated.\n\nThe detector processes the `source` in natural size, making detection results independent of the size rendered\nby the browser.\n\nDetected barcodes are stored as an array of objects in `barcodes` since `source` may contain multiple barcodes.\nEach object has the following properties\n([see here for details](https://developer.mozilla.org/en-US/docs/Web/API/BarcodeDetector/detect#return_value)):\n\n+ `format`: the detected barcode format (one of the formats specified as constructor options)\n+ `rawValue`: the decoded barcode, always a `string` decoded from raw data [as specified](#encoding)\n+ `boundingBox`: the [`DOMRectReadOnly`](https://developer.mozilla.org/en-US/docs/Web/API/DOMRectReadOnly) enclosing the\n  barcode in the `source`\n+ `cornerPoints`: an arry of four `{x, y}` pairs in clockwise order, representing four corner points of the detected barcode.\n   `BarcodeDetectorPolyfill` returns the `boundingBox` corner points.\n\nAdditional properties provided only by `BarcodeDetectorPolyfill`:\n+ `orientation`: `0`\u0026nbsp;\u0026rarr; image is upright, `1`\u0026nbsp;\u0026rarr; rotated 90° clockwise, `2`\u0026nbsp;\u0026rarr; upside down,\n  `3`\u0026nbsp;\u0026rarr; rotated 90° counterclockwise, `-1`\u0026nbsp;\u0026rarr; unknown\n+ `quality`: a positive integer indicating the barcode quality as seen by the detector,\n  specific to each `format`\n\nIf an error occurs during barcode detection then the `detect()` method returns a rejected\n[`Promise`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise)\ncontaining the error.\n\n\n### Typescript support\n\nType definitions for `BarcodeDetectorPolyfill`, for constructor and method parameter types and for result types\nare provided in `@undecaf/barcode-detector-polyfill/dist/main.d.ts`. \n\n\n## Build configurations\n\n### Bundling dependency `@undecaf/zbar-wasm`\n\n[This package](https://www.npmjs.com/package/@undecaf/barcode-detector-polyfill)\nis under the MIT license although it depends on [`@undecaf/zbar-wasm`](https://www.npmjs.com/package/@undecaf/zbar-wasm)\nwhich is under LGPL.\nNevertheless, `@undecaf/zbar-wasm` may be bundled in your project as this does not violate the [LGPL requirements](https://fossa.com/blog/open-source-software-licenses-101-lgpl-license/). \n\nModule `@undecaf/zbar-wasm`, however, expects the WASM file `zbar.wasm` to be located at the same path as itself;\ndetails can be found in the [documentation of `@undecaf/zbar-wasm`](https://github.com/undecaf/zbar-wasm#bundlingdeploying-zbar-wasm).\nTherefore, bundlers must be configured accordingly. Configuration examples for [Rollup](https://rollupjs.org/) and [esbuild](https://esbuild.github.io/)\ncan be found in directory [`example-bundled`](https://github.com/undecaf/barcode-detector-polyfill/tree/master/example-bundled).\nThey were used to bundle the JavaScript code for this [online example](https://undecaf.github.io/barcode-detector-polyfill/example-bundled/)\nin [`docs/example-bundled`](https://github.com/undecaf/barcode-detector-polyfill/tree/master/docs/example-bundled).\n\n### Loading dependency `@undecaf/zbar-wasm` at runtime\n\n~~In order to comply with the LGPL, `@undecaf/zbar-wasm` must not be bundled but may only be loaded as a library at runtime.~~\n`@undecaf/zbar-wasm` can also be loaded at runtime, by default from `https://cdn.jsdelivr.net`. It can also be fetched from\na different endpoint if desired.\n\nBundlers must be configured so that they treat `@undecaf/zbar-wasm` as an external dependency instead of trying to resolve it.\nConfiguration examples for [Rollup](https://rollupjs.org/) and [esbuild](https://esbuild.github.io/)\ncan be found in directory [`example-loaded`](https://github.com/undecaf/barcode-detector-polyfill/tree/master/example-loaded).\nThey were used to bundle the JavaScript code for this [online example](https://undecaf.github.io/barcode-detector-polyfill/example-loaded/)\nin [`docs/example-loaded`](https://github.com/undecaf/barcode-detector-polyfill/tree/master/docs/example-loaded).\nThey also illustrate how to load `@undecaf/zbar-wasm` from a non-default endpoint.\n\n\n## Credits to ...\n\n+ [lekoala](https://github.com/lekoala) for his [`barcode-detector-zbar`](https://github.com/lekoala/barcode-detector-zbar)\n  that has an extensive list of useful links\n+ the makers of [Rollup](https://rollupjs.org/) and [esbuild](https://esbuild.github.io/) for their bundlers\n  which I consider a pleasure to work with\n\n\n## Disclaimer\n\nI, the author of this document, have compiled it to the best of my knowledge, but it still expresses my personal opinion.\nTherefore, in addition to what the licenses mentioned below state, I hereby decline any liability for\nany false, inaccurate, inappropriate or incomplete information that may be presented here.\n\n\n## License\n\nSoftware: [MIT](http://opensource.org/licenses/MIT)\n\nDocumentation: [CC-BY-SA 4.0](http://creativecommons.org/licenses/by-sa/4.0/)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fundecaf%2Fbarcode-detector-polyfill","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fundecaf%2Fbarcode-detector-polyfill","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fundecaf%2Fbarcode-detector-polyfill/lists"}