qr-scanner icon indicating copy to clipboard operation
qr-scanner copied to clipboard

Doesn't work on iOS

Open BenoitDuffez opened this issue 3 years ago • 19 comments

I have tested a lot of Android devices, including old original Moto G or more recent Pixel 3XL, tablets: they all work.

I have only 2 iOS devices: iPhone 6S and iPad 5. They don't work. Some customers/partners tried with other iOS devices: they will not scan the QR.

Admittedly, it's small, but Android has no issue scanning. What's even weirder is that when I try to scan with the iPad, the QR is so clear on screen that my Pixel 3XL is able to scan the QR displayed on the iPad screen! Meaning that the picture the iPad has is just the right quality and it should work.

The Camera app on all iOS devices is able to instantly recognize the QR code. It just doesn't work on the web using your lib. Tested on Safari & Chrome.

BenoitDuffez avatar Sep 09 '21 22:09 BenoitDuffez

Hi, thanks for testing and reporting!

What iOS versions do your iDevices run?

sisou avatar Sep 10 '21 05:09 sisou

Thanks for your feedback. They all use the latest version available today.

BenoitDuffez avatar Sep 10 '21 05:09 BenoitDuffez

Great, now I should look up what the latest supported version for an iPhone 6S is? Just please go into your setting and list the version.

sisou avatar Sep 10 '21 06:09 sisou

Oh, no, sorry about that. Latest as in latest, they're all on iOS 14.7.

BenoitDuffez avatar Sep 10 '21 12:09 BenoitDuffez

Is there any trace or other info I can provide that would help?

BenoitDuffez avatar Sep 17 '21 03:09 BenoitDuffez

Sorry for the delay. Would you be able to provide an example QR code that works on your Android devices, but fails to scan under iOS?

sisou avatar Sep 17 '21 09:09 sisou

Note that Android and iOS use different implementations, therefore it working on Android unfortunately doesn't tell much about iOS yet. The same implementation is shared between iOS and desktop browsers though (with the exception of Webkit based browsers on Mac like Chrome or Opera). Please check whether you're also experiencing issues on desktop. If you could provide us with an example QR code as @sisou said and with a stack trace it would be appreciated :+1:

danimoh avatar Sep 20 '21 15:09 danimoh

Sorry for the delay. Here's the QR:

$ qrencode -v 1 -8 -o /tmp/qr.png '735BRc030010'

qr

The printed size is about 5x5 millimeters. I can send a picture of it but it's not really relevant I guess.

Re: desktop
I tested on Chrome on Linux, but the camera itself is crappy (like blurry). I think I still managed to scan it because even if the demo shows "No QR code detected", it shows "Last detected at" with a timestamp. I'm assuming it worked.
I tested on Chrome on macOS, it never worked, despite the image being clearer than on my Linux laptop.

I don't have more computers to test on (and I don't have any running Windows if that would matter).

BenoitDuffez avatar Sep 20 '21 17:09 BenoitDuffez

Sorry double post. Re: stack trace: how/what would you want me to show? There is no error, just a lack of detection of the QR. So no error means no stack trace, unless I missed something?

Thanks a lot for your support. Let me know if I can do anything to help.

BenoitDuffez avatar Sep 20 '21 17:09 BenoitDuffez

I could also test Safari on mac, and Firefox on both Linux/Mac if that would help/make a difference.

BenoitDuffez avatar Sep 20 '21 18:09 BenoitDuffez

@BenoitDuffez did you "setting up the worker" like in the documentation? I first used the qr scanner without that and it also didn't work on iOS. But after including the worker (qr-scanner-worker.min.js) it works on my native iPhone 12 with the latest iOS15 also on my Safari 15 on MacOS Big Sur (11.5.2).

knufri avatar Sep 29 '21 11:09 knufri

Yes I did, but I may have done it wrong. I'm using webpack and I have this in a .js file included in webpack:

import QrScanner from 'qr-scanner';
import QrScannerWorkerPath from '!!file-loader!../node_modules/qr-scanner/qr-scanner-worker.min.js';

QrScanner.WORKER_PATH = QrScannerWorkerPath;

Is there a way to 100% confirm the worker is loaded and works?

BenoitDuffez avatar Sep 29 '21 13:09 BenoitDuffez

I am having the same issue I get a Scanner error: timeout whenever I scan a qr code only on ios 14.7.1, testing on my laptop works.

I am using webpack and these are my imports:

import QRScanner from 'qr-scanner'
import QRScannerWorkerPath from 'qr-scanner/qr-scanner-worker.min';

QRScanner.WORKER_PATH = QRScannerWorkerPath;

The WORKER_PATH is found because when I remove it, I get an error that it is not found

ChrisCosentino avatar Sep 29 '21 16:09 ChrisCosentino

~I also have the same Scanner error: timeout issue. Worker is loaded correctly. Tested on MacOS Safari~

My mistake, my packaging system wrapped qr-scanner-worker.min.js file in a function, which was never called. I copied the file from node_modules directly to my public folder, then changed WORKER_PATH and it works as it should

ksinas avatar Sep 30 '21 09:09 ksinas

I have the same error on my iPhone, on my MacBook Air m1, it works fine with firefox though: Scanner error: timeout

iveqy avatar Jan 21 '22 15:01 iveqy

I have the same error on my iPhone, on my MacBook Air m1, it works fine with firefox though: Scanner error: timeout

You need to make sure the worker is loaded correctly. Safari doesn't have support for native BarcodeDetector api

ksinas avatar Jan 21 '22 16:01 ksinas

Do you guys still have these issues with the newest release?

Note that with the newest release, specifying the WORKER_PATH is not required anymore, see readme.

@BenoitDuffez 5x5mm is very small indeed. I succeeded in scanning it on an iPhone at 6x6mm from my laptop screen by just setting the px size of the image here in the issue such that it equates to 6mm on my screen. However, at 5mm it already got blurry on my laptop screen. What you could try is to set a custom calculateScanRegion method that does not downsample the image by just omitting downScaledWidth and downScaledHeight. See here for the default implementation: https://github.com/nimiq/qr-scanner/blob/8bb46c3cbc6e6b1c256a7ef6abc866d734493f36/src/qr-scanner.ts#L653-L665

danimoh avatar Feb 04 '22 13:02 danimoh

@danimoh I wasn't really prepared to the excellent support from here and instead switched qr library. Unfortunately that work is no longer relevant for me and I no longer have a way to test this.

Great that it is solved!

iveqy avatar Feb 04 '22 15:02 iveqy

I tried with an iPad and it worked in a couple of seconds. I don't recall how well (bad) it worked before, but I'm pretty sure that this is a huge improvement.

Thank you.

Edit: I don't confirm it works with my iPhone, it seems the lens cap has popped and the device is unable to auto-focus. Might be hardware related. It's weird though, because the camera app still does AF and it also scans the QR code without any issue.

BenoitDuffez avatar Mar 14 '22 13:03 BenoitDuffez