html5-qrcode
html5-qrcode copied to clipboard
Unable to scan long Code_39 barcode
Describe the bug I am not able to scan barcode having Code_39 format .I tried uploading the image file and scan but its giving me error. "y: No MultiFormat Readers were able to detect the code." Please help me
Expected behavior A clear and concise description of what you expected to happen.
Screenshots Attached the pdf file where I want to scan Order number.
Additional context Add any other context about the problem here. 20220112133056595.pdf
Be aware that scanFile()
uses the <div id="reader" width="600px"></div>
even if it is not displaying anything. The image to be decoded seems to be taken from this div. So if the div is too small the encoder may not be able to correctly read the code.
We use a choice of camera scan and image upload, we "secretly" enlarge the div when using scanFile()
.
const html5QrCode = new Html5Qrcode("reader");
// File based scanning
const fileinput = document.getElementById('qr-input-file');
fileinput.addEventListener('change', e => {
if (e.target.files.length == 0) { return }
const imageFile = e.target.files[0];
// enlarge element when using file upload
document.getElementById("reader").style.width = '1000px';
// false does not show the image
html5QrCode
.scanFile(imageFile, false)
.then(decodedText => { scanCallback(decodedText, decodedText) })
.catch(err => { console.log(err) })
});
It took us half a day to figure this out. The same seems true for the camera scan, if you use a small reader div (on mobile with initial-scale=1) you will no be able to get good or any decoding results from large codes. I think this should be mentioned on top of the html5-qrcode readme.
@bluepuma77 I tried it but still failed using a wider width for mobile and desktop browser. I tried also other JS barcode scanner/reader and the result is the same. It looks like it is having a hard time to decode the Code_39. Any other suggestion or alternative solution?
I ended up switching to using the underlying library zxing
which manages to scan code39 much better. For a simple comparison you can do.
HTML5 QR Code: https://blog.minhazav.dev/research/html5-qrcode ZXing: https://zxing-js.github.io/library/examples/multi-camera/
Hope this helps someone.
ok good so you can close the issue.