Google chrome DOMException:系统拒绝 navigator.mediaDevices.getUserMedia 的权限

Google chrome DOMException: Permission denied by system for navigator.mediaDevices.getUserMedia

现在是 2019 年 11 月,此 JavaScript 代码适用于 FireFox(70.0.1(64 位)), 野生动物园 (13.0.2 (15608.2.30.1.1)), 歌剧(版本:65.0.3467.48), 在 Windows Chrome 版本 70.0.3538.77(64 位)上,此代码有效。 但不在 MacOS Google Chrome(版本 78.0.3904.108(官方构建)(64 位)):

navigator
.mediaDevices
.getUserMedia({video: true, audio: true})
.then(stream => {
    console.log("success!")
})
.catch(e => {
    console.log("e: ", e);
});

在 Chrome 的控制台中,我得到:DOMException: Permission denied 经过大量谷歌搜索,我没有找到任何最新信息。在Chrome中,我们究竟如何使用JS来请求摄像头访问权限?

自 MacOSMojave、摄像头和麦克风require OS permissions

这适用于所有非 Apple 产品,包括 Safari 以外的所有浏览器。

检查系统偏好设置 > 安全和隐私 > 隐私 > 摄像头和麦克风。确保 Chrome 已列出并且有一个复选框。

你应该在第一次 Chrome 尝试访问它们时得到一个特殊的 OS 提示。但如果它不小心以某种方式被阻止,您将永远不会再收到提示。

就我而言,即使相关站点未出现在麦克风设置页面上的已阻止站点下,我也会出现此错误。

我必须转到“网站设置”->“查看所有网站上存储的权限和数据”->“查找我的网站”->单击“重置权限”才能解决问题。

我在稍微不同的情况下遇到了同样的错误(Windows 10,Chrome): 我是 运行 本地服务器并从 http://127.0.0.1:5500/。 解决方案是从 http://localhost:5500/ 相反。

就我而言,我没有意识到我正在从事的项目正在添加安全措施 header,阻止使用麦克风的可能性:

Feature-Policy "microphone 'none'; geolocation 'none'"

您的浏览器媒体似乎已禁用, 尝试在 chrome 浏览器

上启用媒体源 video/audio

Feature-Policy has now been renamed to Permissions-Policy in the spec, and this article will eventually be updated to reflect that change. src

在我的例子中,我设置了一个带有空括号的 header

Permissions-Policy: microphone=()

根据这个document,它禁用了访问。

The empty allowlist ensures that the feature is disabled in all contexts everywhere.

因此将 header 更改为

Permissions-Policy: microphone=(self)

解决了我的问题。

Windows 11 - 麦克风隐私设置修复

从其他解决方案来看,似乎有多种问题可能导致此问题。对我来说(Windows 11,Google Chrome)这个问题是由于我的麦克风在我的 Windows 隐私设置中被禁用引起的。

要修复,请单击“开始”并搜索“麦克风隐私设置”。在弹出的控制面板中,将“麦克风访问”切换为开启。