在 Javascript 中检测 Chrome 媒体设置答案

【问题标题】：Detecting Chrome Media Settings in Javascript在 Javascript 中检测 Chrome 媒体设置
【发布时间】：2013-07-12 21:30:36
【问题描述】：

Chrome 最近发布了对其媒体设置的更新，该更新提示用户向允许访问其麦克风和摄像头的网站授予权限。有没有办法在 Javascript 中检测这些设置？

我有一个带有麦克风功能的 Flash 播放器（最终将基于 HTML5）。播放器当前设置了关于如何在开始会话之前授予权限的友好教程。但是，自从 Chrome 发布更新后，Flash 播放器和 Chrome 权限发生冲突，导致 Flash 出现错误，直到用户允许/拒绝 Chrome 设置提示。在将播放器移至 HTML5 之前，我想做的是检测浏览器是否为 Chrome（具有适当的版本）以及用户的设置是否未设置为然后显示额外的教程屏幕。

【问题讨论】：

你最终是如何解决这个问题的？谢谢。
@AdamRabung 在此处查看相关问题：stackoverflow.com/questions/23432654/… 我最终设置了一个标志，该标志存储在用户的本地存储中并过期。该标志在 navigator.getUserMedia API 的成功回调中设置。

标签： javascript google-chrome

【解决方案1】：

几件事：

这是特定于 Chrome 实现的，因此除非 Chrome 向您的应用提供该信息，否则您无法判断用户授予了哪些权限。 IE。没有您可以查询此信息的 API。
它甚至不是 Chrome 存储的东西。如果您查看advanced settings tab on this page，您会发现它基于每个应用程序，而不是一次性的。只有在特定应用程序通过https 请求权限时，Chrome 才会记住授予该应用程序的权限。如果它通过http 请求它，那么它会忘记授予了哪些权限。

您最好的选择（尽管绝不是完全证明）是嗅探浏览器代理和版本。对于这个更好的实现之一，请参阅here。

您需要专门查找 Chrome 和任何 >= 21 的版本。（21 是引入 getMediaApi 的版本）。然后就是简单的if检查：

if (version >= 21){
    //ask permission though the getMediaApi 
} else{
    //ask permission though flash
}

【讨论】：

非常感谢您的洞察力！
@SirTophamHatt 是的，很高兴我能提供帮助。我经常使用 html 5 的东西，所以我之前遇到过这样的问题：P

【解决方案2】：

我偶然发现了一种非常有效的方法，并且不需要 cookie（人们可以在带外更改这些设置，因此 cookie 可能会变得不正确），或者让 Chrome 提供一点帮助（它没有）。

if (chrome) {
  var madeMicDecision = false;
  navigator.getUserMedia({whatever}, 
    function(stream) { 
      madeMicDecision = true;
      //close the stream, move to the next page
      //they have either just granted permission, or have in the past and it's remembered
    },
    function(error) {
      madeMicDecision = true;
      //go to error handling page 
      //the error handling page should describe going to chrome://settings/contentExceptions#media-stream
      //or how to allow the user media via clicking on the crossed out camera icon in the 'wonderbar'
    }
}

但我们还想显示教程屏幕 - 如果不记得权限设置，上面的代码将弹出 chrome 信息框。但是如果没有来自 chrome 的权限事件，或者没有用于查询权限的 API，我们如何知道何时显示 chrome+infobox 教程内容？

我的诀窍是自动显示内容，但只是在延迟之后。之前接受或拒绝权限的人永远不会看到此内容，因为我们的成功/错误处理程序会在延迟之前将它们移开。所以，给 getUserMedia 调用一点时间来检测/反应 - 如果浏览器没有继续前进，是时候显示帮助内容了。

setTimeout(function() { 
    if (!madeMicDescision) {
      //display chrome/infobox/getUserMedia permissions help content
    }
}, 2000);

并不完美（真的很奇怪也很伤心），但似乎适用于最常见的情况。

【讨论】：