Black screen on Flutter Web and iOS

juliansteenbakker / mobile_scanner

A universal scanner for Flutter based on MLKit. Uses CameraX on Android and AVFoundation on iOS.

BSD 3-Clause "New" or "Revised" License

756 stars 446 forks source link

Black screen on Flutter Web and iOS #101

Closed mklepaczko closed 1 year ago

mklepaczko commented 2 years ago

What

When trying to use scanner on Flutter web and IOS I get a black screen and scanner is not working.
This issue is also mentioned in first comment of this tutorial: https://www.youtube.com/watch?v=Oaujc9-LagY

Masishta commented 2 years ago

I confirm this

EricRode commented 2 years ago

Are you using the current release from pub or the main branch from Github? @mklepaczko @Masishta

Masishta commented 2 years ago

Are you using the current release from pub or the main branch from Github? @mklepaczko @Masishta

Current release from pub (version 1.0.0)

EricRode commented 2 years ago

Okay, then please try the main branch from Github because one of the recent PRs fixed this problem. You can use the main branch by including mobile_scanner: git: url: https://github.com/juliansteenbakker/mobile_scanner

Masishta commented 2 years ago

Same issue with git branch

mklepaczko commented 2 years ago

Yes current from pub

Mkl W dniu czw., 14.04.2022 o 09:45 EricRode @.***> napisał(a):

Are you using the current release from pub or the main branch from Github? @mklepaczko https://github.com/mklepaczko @Masishta https://github.com/Masishta

— Reply to this email directly, view it on GitHub https://github.com/juliansteenbakker/mobile_scanner/issues/101#issuecomment-1098808006, or unsubscribe https://github.com/notifications/unsubscribe-auth/AMPEZGAW5GZ2IHSJQJQAQ3LVE7EJ5ANCNFSM5TKUDMPQ . You are receiving this because you were mentioned.Message ID: @.***>

EricRode commented 2 years ago

Unfortunately I don't have an IOS device. Could you try to start the scanner on IOS and take a look at the console of the browser ? Maybe the error is displayed there.

mklepaczko commented 2 years ago

Hello @EricRode ,

First of all thanks for your quick reply and your work on that pluggin!

I just used the pluggin from your main brach, the situation has somehow changed:

now on IOS it is requesting the camera usage acceptance, the red camera icon shows on Safari address bar (did not work before)
Then shows white scaffold page, and the image from the camera appears sometimes after clicking the screen.
The image appears after calling pop() on the screen for a small time before popping the screen and when changing screen orientation, when the screen is rebuilt.
I tried on an Android device, Huawei P30 pro, it does not request camera usage and the screen remains black.

The only errors I could catch from the Safari debugger are the following:

Loading app from service worker. main.dart.js:21614 MobileScannerWeb: NotFoundError: Requested device not found A MediaStreamTrack ended due to a capture failure

Mkl

mklepaczko commented 2 years ago

Hello,

update from today: my iphone 12 updated to IOS 15.4.1 and camera seems to work fine now.

On Android still not working, black screen and no camera request authorization. (Huawei P30 pro)

amendezcabrera commented 2 years ago

This error could be related to another one I found in Android when you try to reopen the MobileScanner widget. It happens trying to read one QR after having read another one. I posted a question in StackOverflow trying to find a solution because I couldn't after many tries. I created a project in my Github where you can reproduce this error using the Android emulator.

MB175 commented 1 year ago

can confirm, does not work in web / iOS and PWA

MB175 commented 1 year ago

Okay, then please try the main branch from Github because one of the recent PRs fixed this problem. You can use the main branch by including mobile_scanner: git: url: https://github.com/juliansteenbakker/mobile_scanner

@EricRode Issue is also present in "^3.0.0-beta.2"

MB175 commented 1 year ago

2.1.0 is working if the service worker is delivered by https "as browser standards require" PWAs are working on iOS and chrome. So if somebody tries to host his PWA on a static Webserver and test it locally make sure the server has a cert otherwise also the mobile browsers won't register the service_workers and the camera won't work

juliansteenbakker commented 1 year ago

Version 3.0.0-beta.4 updated the web framework. Can you please try again with that version, and comment if the issue still exists.

elsenkarmaclub commented 1 year ago

Hi @juliansteenbakker I still got the black screen on the web (chrome) and iOS using 3.0.0-beta.4.

MB175 commented 1 year ago

Hi @juliansteenbakker I still got the black screen on the web (chrome) and iOS using 3.0.0-beta.4.

Chrome on iOS ? if so do u use a https connection otherwise the ServiceWorkers won't work. Chrome on iOS is just WebKit

elsenkarmaclub commented 1 year ago

Hi @juliansteenbakker I still got the black screen on the web (chrome) and iOS using 3.0.0-beta.4.

Chrome on iOS ? if so do u use a https connection otherwise the ServiceWorkers won't work. Chrome on iOS is just WebKit

No, I mean web app (chrome) and also in iOS app.