html5-qrcode: Camera won't launch on iOS PWA
Describe the bug Camera won’t open on iOS in webApp. When the scanner is launched, the camera won’t open when the website is in ‘PWA mode’. This works fine when the scanner is launched on the actual page in Safari/other browsers, but breaks with a WebAppCapable-enabled site (Full-screen page accessible from home-screen).
To Reproduce Steps to reproduce the behavior:
- Have a page include the tag
<meta name="apple-mobile-web-app-capable" content="yes"> - Add the page to the home-screen (On safari: Share button > Add To Home Screen)
- Tap ‘Request camera’, scanner launches but camera is not visible.
Expected behavior When camera permissions are accepted, the camera should open without a problem, as it does on a regular safari website.
Additional context • I have tried doing the same with www.scanapp.org (which supports the web-app-capable tag) – same problem occurs. • On iOS, there’s a camera indicator icon that pops up in the top left when the camera is in use. When the scanner is enabled, it briefly pops up, but then disappears in less than a second.
About this issue
- Original URL
- State: open
- Created a year ago
- Reactions: 5
- Comments: 24
I am facing the same issue right now. My team and I are developing a React app that uses the barcode scanner, and it works fine when visiting our site through Safari. However, when adding the website to the homepage via the process you described above, the same issue occurs. A flash of the camera icon, it disappears, and then a blank scanner element. When we tap “Stop Scanning”, an error pops up saying “TypeError: Argument 1 (‘child’) to Node.removeChild must be an instance of Node”, so I believe that the issue has to do with mounting/rendering the Scanner to the DOM when in PWA mode.
Edit: I have an update. The scanner fails to work in PWA mode on iOS 16.0, but seems to work fine on iOS 16.3
I’m agreeing with you pal, no need to patronize.
Webkit bug (for now): https://bugs.webkit.org/show_bug.cgi?id=273046
Guys I don’t really like to repeat myself, but again this is a golden rule in web development:
We’re getting similar issues on ios 17.4 now, The camera launches then the page completely freezes and cannot do anything until i quit the app/webpage and try again (which it then freezes on) I can replicate on scanapp.org too
if your app doesn’t need to use service worker then remove it, and it will work perfectly. I checked and found that even if you register a service worker that does nothing, the same problem will occur. This error is caused by ios operating system.
There is a Webkit bug report for this, with similar reproducible examples. Show your support here https://bugs.webkit.org/show_bug.cgi?id=252465
hi. i also have same issue the camera scanner is not showing when i have added to the home screen on iOS 16.4.