如何检查访问麦克风的权限是否已被 FireFox 中的用户拒绝答案

【问题标题】：How to check if the permission to access microphone has been rejected by the user in FireFox如何检查访问麦克风的权限是否已被 FireFox 中的用户拒绝
【发布时间】：2019-12-02 00:31:44
【问题描述】：

有没有办法查明用户是否拒绝或允许媒体设备的权限（例如： Firefox 中的麦克风、相机）？在 Chrome 中，我可以使用 navigator.permissions.query 进行检查，但在 Firefox 中失败并显示“TypeError”。

navigator.permissions.query({name:"microphone"}).then(function(promise) {
   if ( promise && promise.state ) {
      console.log(promise.state); //"granted", "prompt" or "rejected"
    }
});
//in Firefox, It throws the error "TypeError: 'name' member of PermissionDescriptor '' is not a valid value for enumeration PermissionName"

由于某种原因，我无法通过 try catch 块捕获上述错误。所以我想知道为什么我不能在 try catch 块中捕捉到这个错误以及是否有替代方法。

用例

我的应用程序具有语音识别功能。在用户遇到寻求访问麦克风的实际“系统对话框”之前，我需要显示“预许可弹出窗口”。这个“预权限弹出”背后的想法是为用户提供应用程序需要访问权限的上下文。如果用户已经授予/拒绝访问权限，则不需要弹出预许可。所以我需要检查麦克风的权限状态并在需要时显示弹出窗口。

【问题讨论】：

嗨，这可能是一个安全问题吗？ getUserMedia 仅适用于安全上下文。除非您在本地主机中，否则它不会在 http 中工作。当 window.onload blog.addpipe.com/common-getusermedia-errors 时也尝试运行本文中的代码
@louiekim 我也通过 https 看到了这个问题。看来 navigator.permissions.query 在 firefox 和 edge 中有限制。
stackoverflow.com/questions/53147944 虽然对于您的情况可能会有一些破解，例如(await navigator.mediaDevices.enumerateDevices()).filter( ({kind}) => "audioinput" )[0].label !== "" 可以告诉我们设备的权限是否已“授予”，尽管从我的测试来看它似乎不太可靠...另请注意，根据用户的设置，UA 可能总是要求权限，因此解释您的用例可能对这个问题有益。
@Kaiido 我包含了用例。
总是显示消息？或者，如果您真的认为它太麻烦，请将 cookie/pref 存储在 localStorage 中，以便每个用户仅显示一次。

标签： javascript html firefox getusermedia mediadevices

【解决方案1】：

不可能

Permissions API 是目前正在开发的实验技术：

Mozilla 认为，使用用户权限的能力对于用户代理至关重要。 API 的某些方面不适合 Firefox 中使用的权限模型，因此我们希望改进 API 的几个方面。特别是，我们认为权限状态的方式需要更准确地反映存在或可能存在的不同状态。我们还认为需要更好地阐明与 Feature Policy 的交互。我们致力于解决此问题，因为权限对于使网络成为更强大的平台变得至关重要，并且确保我们保留用户对其在线体验的控制权也很重要

Mozilla's position about Permissions API

【讨论】：

是的，我知道使用权限 API 是不可能的。所以，我想弄清楚如何使用 try catch 块捕获此错误，或者是否有任何替代方法。
要捕获异常，只需附加.catch(() => console.log('not suppported')). With 'try/catch，如果它不是异步函数，则无法捕获异常。
With .catch: jsfiddle.net/ek9mcx4f async 函数处理异常 with try/catch: jsfiddle.net/d6huca1f
另外，请查看此答案以获取替代方法。 stackoverflow.com/questions/53147944/…
很有可能在 chrome 中