如何使用 javascript/jquery 从图像中读取条码？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/20801919/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to read the barcode from image using javascript/jquery?
提问by Lucky
I'm trying to read the barcode value from image. I used get_barcode_from_image.jsfile but i'm getting either "false" or "XXXXXXXXXXXXXX" value not getting the exact value.
我正在尝试从图像中读取条形码值。我使用了get_barcode_from_image.js文件，但我得到的“false”或“XXXXXXXXXXXXXX”值没有得到确切的值。
<img id="barcode" src="barcode.png"/>
<br/>
<button onclick="alert(getBarcodeFromImage('barcode'))">Scan</button>
Any suggestions for how to get the correct value of barcode image ?
关于如何获得条形码图像的正确值的任何建议？
Thanks in Advance.
提前致谢。
回答by Sergio Ramirez
Try this option, look the links.
试试这个选项，看看链接。
https://github.com/EddieLa/BarcodeReader
回答by Zvi Redler
I found 3 solutions:
我找到了3个解决方案：
QuaggaJSlibrary (open source) for reading barcodes, all done in JavaScript.
Supports EAN, CODE 128, CODE 39, EAN 8, UPC-A, UPC-C, and CODABAR
But you need to Choose Barcode type..
webcodecamjsChoose automatically but not supported well in Mobile.
this JavaScript barcode scanneralso open source and free
https://github.com/EddieLa/BarcodeReader
and was the most acquired scanner (the other 2 wasn't deocode some barcodes).
Atenntion that there is 2 changes need in JavaScript barcode scannerexample for making it work:
remove the two require() in BarcodeReader, instead, add script tag with src pointing to the two js files: exif.js, DecoderWorker.js.
in exif.js, remove var before "root = this" to make root global. Otherwise, root is undefined.
From Here
用于读取条码的QuaggaJS库（开源），全部在 JavaScript 中完成。
支持 EAN、CODE 128、CODE 39、EAN 8、UPC-A、UPC-C 和 CODABAR
但是您需要选择条形码类型..
webcodecamjs自动选择，但在移动设备中不受支持。
这个JavaScript 条码扫描器也是开源和免费的
https://github.com/EddieLa/BarcodeReader
并且是获得最多的扫描仪（另外 2 个没有对某些条码进行解码）。
注意JavaScript 条码扫描仪示例需要进行 2 处更改才能使其工作：
去掉 BarcodeReader 中的两个 require()，改为添加 script 标签，src 指向两个 js 文件：exif.js、DecoderWorker.js。
在 exif.js 中，删除“root = this”之前的 var 以使 root 全局化。否则，root 是未定义的。
从这里
回答by mak
There is Scandit Barcode Scanner SDK for the Webwhich is a barcode recognition engine written in C++. It's compiled to WebAssembly so it can run in modern browsers.
有适用于 Web 的 Scandit Barcode Scanner SDK，它是一个用 C++ 编写的条码识别引擎。它被编译为 WebAssembly，因此它可以在现代浏览器中运行。
Here's a live demothat uses the web or phone camera.
这是一个使用网络或手机摄像头的现场演示。
There's also a client library that can be used to process one frame like this:
还有一个客户端库可用于处理这样的一帧：
<img id="barcode" src="image.png">
<script src="https://unpkg.com/scandit-sdk"></script>
<script>
var image = document.getElementById('barcode');
var canvasContext = document.createElement('canvas').getContext('2d');
canvasContext.drawImage(image, 0, 0);
var imageData = canvasContext.getImageData(0, 0, image.width, image.height).data;
console.log('Loading...');
ScanditSDK.configure("xxx", {
engineLocation: "https://unpkg.com/scandit-sdk/build/"
}).then(() => {
console.log('Loaded');
var scanner = new ScanditSDK.Scanner({
imageSettings: {
width: image.width,
height: image.height,
format: ScanditSDK.ImageSettings.Format.RGBA_8U
},
scanSettings: new ScanditSDK.ScanSettings({
enabledSymbologies: [ScanditSDK.Barcode.Symbology.QR]
})
});
scanner.onReady(function() {
console.log('Ready');
scanner.processImage(imageData)
.then(result => console.log(result));
});
});
</script>
Links:
链接：
Disclaimer: I work for Scandit
免责声明：我为 Scandit 工作
