wkwebview - navigator.mediaDevices not available on iOS 14.3

link之家

链接快照平台

输入网页链接，自动生成快照
标签化管理网页链接

Collectives™ on Stack Overflow

Find centralized, trusted content and collaborate around the technologies you use most.

Learn more about Collectives

Teams

Q&A for work

Connect and share knowledge within a single location that is structured and easy to search.

Learn more about Teams

In the past, navigator.mediaDevices.getUserMedia() was not available on WKWebView, but it has now been added as part of iOS 14.3, as these links show:

https://developer.apple.com/forums/thread/88052?answerId=668022022#668022022 (original thread)

https://caniuse.com/stream (see note 3)

https://webkit.org/blog/11353/mediarecorder-api

However, I updated the deployment target of an application to iOS 14.3 and then attached the Safari debugger to the WKWebView, but navigator.mediaDevices still returns undefined when run on the JS console. In the third link above there are suggestions on steps to take in order to use getUserMedia .

navigator.mediaDevices.getUserMedia can now be exposed to WKWebView applications. navigator.mediaDevices.getUserMedia is automatically exposed if the embedding application is able to natively capture either audio or video. Please refer to Apple documentation to meet these requirements.

I have followed the steps just in case but I still face the same problem.

Any ideas what I might be doing wrong? Has anyone else faced the same problem?

Tested on iOS 14.5 and I see


    navigator.mediaDevices.getUserMedia

defined as:


    function getUserMedia() { [native code] } = $1

. Don't have 14.3 to test with. – Brandon Jul 22, 2021 at 14:15

My guess is your content is not secure. If you navigate to a https:// location, navigator.mediaDevices will be available.

See 2nd note on this page: https://developer.mozilla.org/en-US/docs/Web/API/MediaDevices/getUserMedia

Thank you. This was the underlying cause, although in my case I was accessing


    navigator.userAgent

before the page (which is https, by the way) got loaded onto the webview. As a result,


    navigator

seemed to assume that it was an unsecure origin and disabled media capture, even after the page finished loading. Simply removing the user agent code did the trick. – Victor Durojaiye Aug 29, 2021 at 17:03

In Info.plist add: Privacy - Camera Usage Description https://developer.apple.com/documentation/avfoundation/cameras_and_media_capture/requesting_authorization_for_media_capture_on_ios

And in order video element could play from your camera:

let webConfiguration = WKWebViewConfiguration()
webConfiguration.allowsInlineMediaPlayback = true
How to play: https://developer.mozilla.org/en-US/docs/Web/API/MediaDevices/getUserMedia
        Thanks for contributing an answer to Stack Overflow!
Please be sure to answer the question. Provide details and share your research!
But avoid …
Asking for help, clarification, or responding to other answers.
Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.