As of iOS 12, navigator.mediaDevices.getUserMedia()
is returning an error in Safari.
To recreate this, open iPhone Web Inspector, then run this snippet in the console:
var constraints = { audio: true, video: { width: 1280, height: 720 } };
navigator.mediaDevices.getUserMedia(constraints)
.then(function() {
console.log('getUserMedia completed successfully.');
})
.catch(function(error) {
console.log(error.name + ": " + error.message);
});
You'll see that this runs successfully in desktop browsers, and in iOS 11 Safari, but fails in iOS 12 Safari.
NotAllowedError: The request is not allowed by the user agent or the platform in the current context, possibly because the user denied permission.
Any idea why?
note: This is happening prior to the user being asked if their camera can be accessed, ruling out the possibility of it being because the user denied permission.
There are two possible reasons for immediate NotAllowedError
at the moment:
Safari seems to require https
for camera and mic access, both in iOS and OSX.
With an https link, iOS Safari 12 works for me; same link in http gets NotAllowedError
.
Chrome has the same requirement. This is consistent with the direction of the specification, which recently has restricted getUserMedia
to secure contexts. Browsers who have yet to update, still expose navigator.mediaDevices
in http, but getUserMedia
always rejects with NotAllowedError
.
In the future, expect browsers to remove mediaDevices
entirely in http, to comply with the spec.
This appears new with Safari 12. In iframes, getUserMedia
's feature policy is off by default for cross-origin content.
This works for me:
<iframe
allow="camera;microphone"
src="https://webrtc.github.io/samples/src/content/getusermedia/gum/">
</iframe>
<iframe src="https://webrtc.github.io/samples/src/content/getusermedia/gum/">
</iframe>
...and in addition to failing with NotAllowedError
, Safari warns in web console:
The top-level frame has prevented a document with a different security origin to
call getUserMedia.
This is also a recent update to the spec.