top | item 39013229

Using the ZBar barcode scanning suite in the browser with WebAssembly

97 points| akbarnama | 2 years ago |barkeywolf.consulting

26 comments

order
[+] mfrisbie|2 years ago|reply
QR codes are very easy to scan in-browser, but 1D barcodes are significantly more challenging. ~75% of the cannabis industry deals with Metrc, which forces companies to place 1D Code-128 barcode tags on everything they grow or manufacture. As a result, I've spent a lot of time investigating ways to scan these barcodes with a phone camera in a cross-browser webpage.

Ultimately, after much experimentation, the unavoidable conclusion is that the optical scanning solutions are junk. Connecting a crappy $20 HID bluetooth barcode scanner to a phone is so crazily better at scanning a 1D barcode than even the most massaged optical barcode scanning libraries. Industry workers that deal with these barcodes don't even bother with phone camera scanning, it's way too slow and temperamental.

[+] ladberg|2 years ago|reply
I'm not sure what they use to do it, but I'm amazed by the "Lose It!" app's barcode scanning feature. It'll scan correctly in the first fraction of a second that a barcode is visible on-screen with bad lighting, motion blur, weird/reflective colors, and crinkling.
[+] droopyEyelids|2 years ago|reply
At first I was angry when I had to switch to HID barcode readers because I couldn't get an app to do it well, but in the end I was very happy I did it because the ergonomics of a barcode reader are so much better than with a phone or webcam. Not just the mounting options available but also the projected red laser making things reflex-easy.

Has that been a part of your project yet? I ask because I can't easily imagine any situation where the workers would be more efficient or happier using a phone/webcam/etc to do the scannings

[+] ChadB|2 years ago|reply
I built a home-grown scanner like this one (not with ZBar though) for my asset tracking web app (www.assetbots.com) and agree that for 1D barcodes a cheap bluetooth or USB scanner is hard to beat.

We support both (camera and external), but surprisingly a lot of our customers find the camera good enough. Code 128 is our second-most scanned symbology behind QR.

[+] sllabres|2 years ago|reply
At least processing scanned 1D barcodes at resolutions of 200-300 DPI can be surprisingly hard. After deskewing the tolerances of a traditional EAN barcode are always violated due to aliasing in the image.

Probably a HID scanner has the advantage of a better spatial (horizontal) resolution?

[+] admp|2 years ago|reply
There’s also the experimental https://developer.mozilla.org/en-US/docs/Web/API/Barcode_Det... — already live in Chrome.
[+] jauntywundrkind|2 years ago|reply
I really wish mdn samples showed output. As is semi-typical, the examples show console.log of the results, but no sample output is provided.

I'm mainly curious whether position information is provided, and whether or not multiple barcodes can be detected at once. Digging further I see the output is an array and cornerPoints are provided, but i keep feeling like these samples only show 50% of what I want to see.

[+] mhb|2 years ago|reply
Would be interested to know the time it takes to scan a barcode. (Compared to a hardware scanner.)
[+] michaelt|2 years ago|reply
The answer to that is: It depends.

You can run barcode detection at 30fps on a 1080p video using any modern PC, no problem at all.

But high performance industrial barcode scanners have certain features that would be undesirable in any other application. A greyscale-only sensor for maximum sensitivity, jittery autofocus and autoexposure to respond fast when something appears right in front of the lens, autofocus switching attention so everything in view gets a chance at being in focus, built-in illumination to help avoid motion blur, and so on.

So although the software can provide a good framerate, a laptop webcam may still perform worse than a dedicated barcode scanner.

(zbar is a mixture of good and bad - if you want to experience software barcode detection for yourself your phone's app store probably offers 'scandit' which is closed source but performs pretty well)

[+] yonatan8070|2 years ago|reply
I can't tell you about this library in WASM, but I know that ZXing on Android (integrated in Binary Eye [1]) can scan a 1D or 2D barcode instantly (to my human eyes) on my Poco F3, it's fast enough that I need to be careful when scanning serial numbers off of hard drives to scan a specific barcode
[+] steinso|2 years ago|reply
My (some what old) iPhone 11 scans a QR code from a full frame from the camera within 30-50ms using this, or some similar WASM solution.
[+] chkuendig|2 years ago|reply
(2018)

Webassembly isn't THAT "new and shiny" anymore in 2024 :)

[+] Groxx|2 years ago|reply
Hopefully there's an API to access the back camera on phones instead? The front really doesn't have the resolution necessary for many barcodes.