navigator.permissions.query alternative for iOS Safari - ios

Question

I programmed a script that allows visitors of our website to record audio and then saves the file on our server.
Everything worked perfectly until I noticed, that if a user did not give his permission but presses the recording button anyway, the script crashed. Therefore I included this to make sure that permission was granted:
navigator.permissions.query({name:'microphone'}).then(function(result) {
if (result.state == 'granted') {
//GRANTED
} else if (result.state == 'denied') {
//DENIED
}
});
Unfortunately, this does not work for iOS Safari and therefore leads to a crash again in this case. I found several threads about this topic but not a single solution for iOS. But there must be one, right? How should we record audio on an iPhone if we cant make sure that the permission was granted and if recording while under denial of microphone access also leads to a crash?
I hope anyone has an Idea. Thanks in advance.
Daniel

Answer 1

MDN Navigator.permissions (last edit on 2021-09-14) mentions this is an "experimental technology" and the compatibility table shows there's no support for Safari on both MAC and mobile devices (IE and Android WebView as well).
However from an answer from kafinsalim tackling the same issue, the geolocation object is supported on all major browsers. Accessing navigator.geolocation directly without checking permissions raises a permission prompt without throwing errors.
Therefore if you still need to use navigator.permissions check userAgent:
if (!/(safari))/i.test(navigator.userAgent)) {
navigator.permissions.query({ name: 'geolocation' }).then(({state}) => {
switch(state) {
case 'granted':
showMap();
break;
case 'prompt':
showButtonToEnableMap();
break;
default:
console.log('Geo permitions denied');
}});
// https://developer.mozilla.org/en-US/docs/Web/API/Navigator/permissions#examples
} else {
// Safari bypassing permissions
navigator.geolocation.getCurrentPosition(
pos => console.log('success', pos.coords),
e => console.log('failed', e)
);
// https://w3c.github.io/geolocation-api/#handling-errors
}

Answer 2

Please try this one.
navigator.permissions.query({name:'microphone'}).then(function(result) {
if (result.state === 'granted') {
//GRANTED
} else if (result.state === 'denied') {
//DENIED
}
});