Question

我正在尝试从图像中读取条形码值。我使用了get_barcode_from_image.js文件，但我得到的是“假”或“XXXXXXXXXXXXXX”值没有得到确切的值。

<img id="barcode" src="barcode.png"/>
<br/>
<button onclick="alert(getBarcodeFromImage('barcode'))">Scan</button>

有关如何获得正确的条形码图像值的建议吗？

先谢谢。

Answer 1

尝试此选项，查看链接。

https://github.com/EddieLa/BarcodeReader

Demo

Answer 2

我找到了3个解决方案：

QuaggaJS库（开源），所有这些都是用JavaScript完成的。

支持EAN，CODE 128，CODE 39，EAN 8，UPC-A，UPC-C和CODABAR

但您需要选择条形码类型..
webcodecamjs在移动设备中自动选择但不受支持。
此JavaScript barcode scanner也是开源和免费的

https://github.com/EddieLa/BarcodeReader

并且是获得最多的扫描仪（另外2个没有解码一些条形码）。

需要在 JavaScript条形码扫描器示例中进行2次更改才能使其正常工作：
- 删除BarcodeReader中的两个require（），改为添加脚本标记，src指向两个js文件：exif.js，DecoderWorker.js。
- ，在＆＃34; root = this＆＃34;之前删除var。使root成为全局的。否则，root是未定义的。
来自Here

Answer 3

Scandit Barcode Scanner SDK for the Web是用C ++编写的条形码识别引擎。它被编译为WebAssembly，因此它可以在现代浏览器中运行。

这是使用网络或手机摄像头的live demo。

还有一个客户端库可用于处理这样的一个帧：

<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>

链接：

免责声明：我为Scandit工作

如何使用javascript / jquery从图像中读取条形码？

3 个答案: