This stuff has been a nightmare for us for a long time. We have to scan pdf417 barcodes from physical identification as part of our offering.<p>Recently, we stumbled upon some cheap USB keyboard emulator 2d scanners that can pick these up very reliably. For our product/customers, this is a viable path. We have tested probably 30 different webcams by this point. The only 2 that are as reliable as the handheld CCD scanner are the iPad and my Canon DSLR tethered to my PC in automatic mode with a macro lens.<p>Resolution is a factor, but so is frame rate and environment. You have to consider the full UX stack. Someone is required to physically position the barcode in a particular way with certain lighting constraints, etc. With a handheld CCD scanner, you get a laser guide for precisely what distance to go for, and an ergonomic experience that is much more conducive to successful scans. Most offer on board illumination, so even in a pitch black room you will get a successful scan.
>Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.<p>What's the point of this? I understand why you might want this for APIs that expose private user information, but this just performs some computation. You could do the same thing with a js library or webassembly. Is this just to punish http sites?
There is a full copy of the zxing library in JS. It's been working great for my purposes - scanning QR and C128 Barcodes.<p>E: <a href="https://github.com/zxing-js/library" rel="nofollow">https://github.com/zxing-js/library</a>
I recently made a webapp for scanning barcodes using the phone camera for warehouse use. I used QuaggaJS. I disabled the barcode locator because it was too heavy, instead I just draw a box on the screen that the barcode is to be positioned in. The barcode detection and decoding happens entirely in the browser and it works very well.
As the page does not discuss the motivation behind the API, does anyone know why this is ”native” API and not just a generic image processing script implemented with JavaScript / WebGL / etc.?
There's a couple good datasets with trained models on Roboflow Universe that would pair nicely for a Computer Vision project/app:<p>Object Detection for QR Code and Bar-Codes -
<a href="https://universe.roboflow.com/new-workspace-mrc2b/optiscan-lwrhq/overview" rel="nofollow">https://universe.roboflow.com/new-workspace-mrc2b/optiscan-l...</a><p>another one for just QR Codes -
<a href="https://universe.roboflow.com/lihang-xu/qr-code-oerhe" rel="nofollow">https://universe.roboflow.com/lihang-xu/qr-code-oerhe</a>
Bit off-topic: can anyone recommend resources (videos/papers/tutorials) that could help me learn how QR barcode detection and scanning itself is implemented?<p>I've been thinking that building a basic scanner from scratch (i.e. only using vanilla cpp/python/whatever + image processing libraries, but nothing barcode-specific) could teach me a lot.
I forked another person's code and added bounding boxes, if you want to check it out. Seems like it works pretty well, though the bounding boxes are erratic.<p><a href="https://gist.github.com/derac/9dfa8884bb04df59ac498d3bac4a93da" rel="nofollow">https://gist.github.com/derac/9dfa8884bb04df59ac498d3bac4a93...</a><p><a href="https://htmlpreview.github.io/?https://gist.githubusercontent.com/derac/9dfa8884bb04df59ac498d3bac4a93da/raw/25f660ba8486774a8ac281f8442e8b58b1afbaaf/index.html" rel="nofollow">https://htmlpreview.github.io/?https://gist.githubuserconten...</a>
Cool. Another feature that Firefox won't support. Same with the WebSerial API and others. I sort of understand their reasoning that they want to make a web browser and not an application platform, but that's where the web is shifting to ... or rather has already for a long time. And people wonder why every new tech/browser is based on Chromium all the time. Well, this is one of the many reasons.
Here is an example of using the Barcode Detection API w/ WebRTC on Android / Chrome: <a href="https://files.littlebird.com.au/barcode20.html" rel="nofollow">https://files.littlebird.com.au/barcode20.html</a>
Does anyone happen to know where in the Chromium code base the implementation is hiding?<p>The android version seems to use a library that's part of Google Play Services:<p><pre><code> /**
* Implementation of mojo BarcodeDetection, using Google Play Services vision package.
*/
</code></pre>
and<p><pre><code> // The vision library will be downloaded the first time the API is used
// on the device; this happens "fast", but it might have not completed,
// bail in this case. Also, the API was disabled between and v.9.0 and
// v.9.2, see https://developers.google.com/android/guides/releases.
</code></pre>
From: <a href="https://github.com/chromium/chromium/blob/c4d3c31083a2e1481253ff2d24298a1dfe19c754/services/shape_detection/android/java/src/org/chromium/shape_detection/BarcodeDetectionImpl.java" rel="nofollow">https://github.com/chromium/chromium/blob/c4d3c31083a2e14812...</a><p>The desktop version references a third party library called "barhopper" here:<p><a href="https://github.com/chromium/chromium/blob/e1e495b29e1178a451f65980a6c4ae017c34dc94/services/shape_detection/barcode_detection_impl_barhopper.cc" rel="nofollow">https://github.com/chromium/chromium/blob/e1e495b29e1178a451...</a><p>and barhopper seems to come from a non-public Google repo:<p><pre><code> 'src/third_party/barhopper': {
'url': 'https://chrome-internal.googlesource.com/chrome/deps/barhopper.git' + '@' + 'ad3c4382875afdd0340f1549f8b9c93cbbc16e37',
'condition': 'checkout_src_internal and checkout_chromeos',
},
</code></pre>
from <a href="https://source.chromium.org/chromium/chromium/src/+/master:DEPS" rel="nofollow">https://source.chromium.org/chromium/chromium/src/+/master:D...</a><p>I didn't realize that Chromium had missing APIs compared to Chrome but maybe that's always been the case? This appears not to be a W3C standard:<p><a href="https://wicg.github.io/shape-detection-api/" rel="nofollow">https://wicg.github.io/shape-detection-api/</a><p>I was interested in this because there are no really good open source DataMatrix decoders (to my knowledge) with the one in ZXing being basically unusable (last I checked) and libdtmx being ok but not comparable to commercial offerings.
A different context but related: a website plugin that I have built years ago for barcode scanning machines: JBarcode - <a href="https://github.com/veysiertekin/jbarcode" rel="nofollow">https://github.com/veysiertekin/jbarcode</a><p>I didn't made any changes since then. But it can be easily ported into a more modern framework (React.js etc)
I’m happy to see things like this. My ISP used to ask for a picture of my docsis modem sticker because people kept making mistakes entering in the MAC address.<p>Unfortunately, the csr was just keying them in and keyed mine in wrong so I was without internet for a few days.<p>Something to automatically pick it out would be a lot better.
I’d love to see this in safari on iOS as well. The native barcode detection capabilities in iOS are substantially better than libraries like zximg, and I like barcodes as an interface between the real world and tech. I also wish text recognition were in safari.
Huh, TIL. Recognition performance is pretty modest (on Chrome/Mac at least) but it's fast and probably more than adequate for most close-up mobile device scans. It basically just wraps MacOS's Vision framework on the Mac, and ML Kit on Android.
It's a nice feature, but, honest question, why is this a web API?<p>I don't see anything this has to do with browsers. This could be implemented perfectly well in a library.
I'm still looking for an open source python library that can decode Data-Matrix barcodes as seen on Digikey bags. Should I give up and switch to JavaScript+browser?