I'm making a web app that needs to check whether user camera access permission has been granted or not using permission query.
I have tried the code:
navigator.permissions.query({name:'camera'}).then(function(result) {
console.log(result);
});
It ran fine on Google Chrome 70 but gave me an error on firefox:
TypeError: 'name' member of PermissionDescriptor 'camera' is not a valid value for enumeration PermissionName.
I have been searching for this issue but nothing helped.
Can anyone help me please ?
Thanks,
The Permissions API is marked as an experimental technology.
The issue is that Firefox does have navigator.permissions
and support the query
method on it, too, however, it does not support all the permission names that are listed on MDN's Permissions API page.
You can try this yourself: go to the console on Firefox and execute
// geolocation is working fine
navigator.permissions.query({ name: 'geolocation' }).then(console.log)
// camera, microphone is not supported, throws
navigator.permissions.query({ name: 'camera' })
// TypeError: 'name' member of PermissionDescriptor 'camera' is not a valid value for enumeration PermissionName.
navigator.permissions.query({ name: 'microphone' })
// TypeError: 'name' member of PermissionDescriptor 'microphone' is not a valid value for enumeration PermissionName.
There is an open discussion on Github in the mozilla/standards-positions
about their position on the Permissions API. To be honest, as I see, they did not reach any conclusion yet.
What you can do is you create a basic functionality that works on all browsers without the permissions information and on Chrome, you progressively enhance the user experience by using the Permissions.query
for figuring out the permissions for camera and microphone.
Alternatively, you can come up with some logic to handle this using MediaDevices.getUserMedia
: for example, you can call getUserMedia
and immediately stop the tracks, if the only thing you want is to ensure you app has permissions granted for microphone and camera. Be careful though, there are multiple problems with this: