首页 > 解决方案 > iOS Safari 的 navigator.permissions.query 替代品

问题描述

我编写了一个脚本,允许我们网站的访问者录制音频,然后将文件保存在我们的服务器上。

一切都很顺利,直到我注意到,如果用户没有给予他的许可但无论如何按下了录制按钮,脚本就会崩溃。因此,我将其包括在内以确保授予权限:

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

不幸的是,这不适用于 iOS Safari,因此在这种情况下会再次导致崩溃。我找到了几个关于这个主题的主题,但没有找到一个适用于 iOS 的解决方案。但一定有一个,对吧?如果我们无法确保已授予权限并且在拒绝麦克风访问的情况下录制也会导致崩溃,我们应该如何在 iPhone 上录制音频?

我希望任何人都有一个想法。提前致谢。丹尼尔

标签: iossafaripermissionsmicrophone

解决方案


MDN Navigator.permissions(最后一次编辑于 2021-09-14提到这是一项“实验性技术”,兼容性表显示 MAC 和移动设备(IE 和 Android WebView 也一样)不支持 Safari。

然而,从 kafinsalim解决同一问题的回答来看,所有主要浏览器都支持地理定位对象。直接访问navigator.geolocation而不检查权限会引发权限提示而不会引发错误。

因此,如果您仍然需要使用navigator.permissions检查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
}

推荐阅读