CODEWITHSUNDEEP
javascriptioscanvaswebrtcgetusermedia
owenmelbz
owenmelbz

Reputation: 6564

iOS 11.3 Camera access via getUserMedia and black screens

Now that iOS 11.3 is out with the updated version of Safari.

Has anybody been able to successfully use the getUserMedia APIs to display the camera output onto a canvas?

e.g We've opened both

https://simpl.info/getusermedia/

and

https://webrtc.github.io/samples/src/content/getusermedia/canvas/

in Safari, they both ask for access to the camera - however, neither of them render anything but a black square

e.g

screenshot of the issue

Upvotes: 8

Views: 7118

Answers (1)

jknotek
jknotek

Reputation: 1864

Adding a playsinline attribute to the relevant <video> tag should do the trick:

var video = document.getElementById("video-element");    
video.setAttribute("playsinline", true);

I've also found this bug difficult to replicate. And judging from the comments above, I'm not sure it's due to iOS version changes alone. Moreover, I'm unable to find any official documentation on the topic.

Nonetheless, here is some related reading material:

See this issue on GitHub

And this StackOverflow question: iOS 11 getUserMedia not working?

Edit: The WebKit BugZilla thread was mentioned in the GitHub issue I referenced above, which seems to be the closest thing to "official documentation" available.

Upvotes: 28

Related Questions