Javascript Chrome扩展-getUserMedia抛出；NotAllowedError:由于关闭而失败；

我有一个套件，记录用户的网络摄像头和麦克风。它在网页上非常有效，但在Chrome的扩展中：

navigator.mediaDevices.getUserMedia({video: true, audio: true})
    .then(this.record.bind(this))
    .catch(VidRA.error);

正在投掷

NotAllowedError: Failed due to shutdown

---

我搜索了一下，几乎找不到任何可以解释这一点的东西。有没有其他人遇到过这个问题，或者有人知道我能做些什么？

哇，这是一个雷区

首先，这似乎是（谢谢，@wOxxOm）

所以我们需要对它进行编码

由于后台脚本在请求媒体访问时会生成此错误，因此我们需要在其他地方请求它。如果您尝试从弹出窗口JS中执行操作，则会生成相同的错误，因此将退出

那么，这些步骤是：

• 内容脚本请求访问媒体设备

• 成功后，内容脚本通知后台脚本

• 收到消息后，后台脚本请求访问媒体设备；由于内容脚本已经成功，后台脚本现在也将成功

关键是，内容脚本必须在扩展的上下文中运行，而不是在当前网页（在活动选项卡中）。也就是说，内容脚本必须通过

chrome://

开头的URL来运行，该URL由

chrome.runtime.getURL（）

生成

这是因为用户只被要求获得一次权限，因为他们的决定是在一个域一个域的基础上被记住的。在扩展上下文（而不是当前网页）中运行脚本意味着总是在同一个基于扩展的域中请求权限（并记住决策），而不是在访问的每个网站域中再次请求权限

我的方法是使用一个持久内容脚本（在

content\u scripts

下的清单中指定），当扩展打开时，它的任务是将iframe注入当前选项卡的页面

iframe从扩展加载了一个页面，我们称之为

iframe.html

，它最终负责请求访问

---

唷…

乌特卡诺斯的答案很好，但别忘了补充

frame.setAttribute("allow", "microphone; camera");

---

在manifesto.json中包含这一点为我解决了这个问题

"web_accessible_resources": ["background.js"]

---

D'oh…………这也能解决问题吗？不知道-没试过。我不太喜欢这种方法，因为它需要用户进入选项并在那里设置权限。使用下面的答案，您可以在不调用选项的情况下实现同样的效果。为什么您决定在后台脚本而不是弹出脚本中进行录制？因为弹出脚本在弹出窗口关闭时立即消失，而弹出窗口在失去焦点时关闭。我希望用户能够记录自己与屏幕的交互，这将触发弹出关闭。明白了。我使用的正是您的解决方案：我首先在内容脚本中调用

navigator.mediaDevices.getUserMedia

，然后向后台脚本发送一条消息，该脚本随后调用完全相同的函数，但现在我得到一个与第一个非常类似的错误：

domeException:由于后台脚本关闭而失败。有什么想法吗？这里有什么问题？谢谢嗯，这真是太好了。我不记得那是怎么回事了-可能是有人在Chrome开发者论坛上知道的一个bug？我确实看过几次，但想不起来我是怎么处理它的。你还记得在扩展上下文中运行内容脚本是什么意思吗？可能是在
content\u scripts
下加上
“matches”：[“”]
？这！我追了几个小时这个虫子。哈哈哈哈哈哈哈哈哈哈这让我头疼。谢谢你，兄弟：这没什么意义。后台脚本和web可用资源之间没有任何共同之处。后者用于通过
chrome://
URL允许当前网页可以使用扩展中托管的资产。不知何故，它绕过了对摄像头的请求权限，并且我能够在后台脚本中使用摄像头，在最新的chrome更新后，此选项不再可用。但在更新之前，它只工作了整整两周。真奇怪。。。。