Skip to content

Camera for iOS is not working in inside webview #1672

Closed
@berajesh

Description

@berajesh

I tried to access the iOS camera within webview. but it's not working as expected. It's working fine in the Safari browser in iOS, Chrome browser in Android, and android webview. However, nothing happens inside webview in iOS. I granted required permissions like camera or audio, however, it still does not work.

Activity

mjurkowski

mjurkowski commented on Oct 19, 2020

@mjurkowski

The same issue

SimonBellucci

SimonBellucci commented on Oct 26, 2020

@SimonBellucci

The reason why you can't access the camera on iOS is because it relies on mediaDevices.getUserMedia and mediaDevices is null in WKWebView browsers.

On iOS-Devices camera access works only in native Safari and not in other Browsers (Chrome,...) or Apps that use an UIWebView or WKWebView. This is not a restriction of this component but of the limited WebRTC support by Apple.

This is still not resolved on iOS 14, if you want to stay updated on this topic, please refer to this thread.

sathwik77

sathwik77 commented on Nov 30, 2020

@sathwik77

@SimonBellucci So we don't have access to getUserMedia in Web View, but why does the docs say we can use NSCameraUsageDescription ? I was just wondering is there a way to open camera in IOS in web view?

Screen Shot 2563-11-30 at 17 07 28

MarwaAbuEssa

MarwaAbuEssa commented on Dec 15, 2020

@MarwaAbuEssa

the same issue here

jayan2019

jayan2019 commented on Dec 30, 2020

@jayan2019

iOS 14.3 Supported

https://developer.apple.com/forums/thread/88052

Hope this will help!

wahaj-47

wahaj-47 commented on Feb 10, 2021

@wahaj-47
Attachment_1612945361.mp4

For me the camera opens up if I pass in the prop mediaPlaybackRequiresUserAction={false}. However the webview treats it like a live broadcast and I end up with nothing but a black screen. The camera is still open in the background so if you point it to a QR code, it scans it.

Edit: Adding the prop allowsInlineMediaPlayback and removing the mediaPlaybackRequiresUserAction prop seems to have fixed it.

github-actions

github-actions commented on Apr 12, 2021

@github-actions

Hello 👋, this issue has been opened for more than 2 months with no activity on it. If the issue is still here, please keep in mind that we need community support and help to fix it! Just comment something like still searching for solutions and if you found one, please open a pull request! You have 7 days until this gets closed automatically

Zain228

Zain228 commented on May 6, 2021

@Zain228

Attachment_1612945361.mp4

For me the camera opens up if I pass in the prop mediaPlaybackRequiresUserAction={false}. However the webview treats it like a live broadcast and I end up with nothing but a black screen. The camera is still open in the background so if you point it to a QR code, it scans it.

Edit: Adding the prop allowsInlineMediaPlayback and removing the mediaPlaybackRequiresUserAction prop seems to have fixed it.

Can you please show the code because i am doing all the things but not working

wahaj-47

wahaj-47 commented on May 6, 2021

@wahaj-47

Attachment_1612945361.mp4
For me the camera opens up if I pass in the prop mediaPlaybackRequiresUserAction={false}. However the webview treats it like a live broadcast and I end up with nothing but a black screen. The camera is still open in the background so if you point it to a QR code, it scans it.
Edit: Adding the prop allowsInlineMediaPlayback and removing the mediaPlaybackRequiresUserAction prop seems to have fixed it.

Can you please show the code because i am doing all the things but not working

Just add the props

allowInlineMediaPlayback={true}
mediaPlaybackRequiresUserAction={false}

On iOS it doesn't work on older iOS versions so I just listen to URL change events and open up a scanner using react-native-barcode-scanner on the correct URL.

Zain228

Zain228 commented on May 7, 2021

@Zain228

Attachment_1612945361.mp4
For me the camera opens up if I pass in the prop mediaPlaybackRequiresUserAction={false}. However the webview treats it like a live broadcast and I end up with nothing but a black screen. The camera is still open in the background so if you point it to a QR code, it scans it.
Edit: Adding the prop allowsInlineMediaPlayback and removing the mediaPlaybackRequiresUserAction prop seems to have fixed it.

Can you please show the code because i am doing all the things but not working

Just add the props

allowInlineMediaPlayback={true}
mediaPlaybackRequiresUserAction={false}

On iOS it doesn't work on older iOS versions so I just listen to URL change events and open up a scanner using react-native-barcode-scanner on the correct URL.

Okay then how you send scanned data to web? and is it working on latest iOS versions?

anhvoduy

anhvoduy commented on Jun 16, 2021

@anhvoduy

Camera does not work as simple Web View for IOS, please help:

Screen Shot 2021-06-17 at 12 59 05 AM

HerickRaposo

HerickRaposo commented on Jul 6, 2021

@HerickRaposo

Attachment_1612945361.mp4
For me the camera opens up if I pass in the prop mediaPlaybackRequiresUserAction={false}. However the webview treats it like a live broadcast and I end up with nothing but a black screen. The camera is still open in the background so if you point it to a QR code, it scans it.
Edit: Adding the prop allowsInlineMediaPlayback and removing the mediaPlaybackRequiresUserAction prop seems to have fixed it.

Can you please show the code because i am doing all the things but not working

Just add the props

allowInlineMediaPlayback={true}
mediaPlaybackRequiresUserAction={false}

On iOS it doesn't work on older iOS versions so I just listen to URL change events and open up a scanner using react-native-barcode-scanner on the correct URL.

Could you display how to do this for us? Please i need to do this in two times during execution webview, one time with QR scanner and other with barcode scanner. Please helpme.

18 remaining items

Loading
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

      Development

      No branches or pull requests

        Participants

        @mjurkowski@wmaca@MarwaAbuEssa@wahaj-47@eslambasher

        Issue actions

          Camera for iOS is not working in inside webview · Issue #1672 · react-native-webview/react-native-webview