检测HTML5 Media Capture API支持

Question

有没有办法检测浏览器是否支持我正在构建的移动网站的HTML5 Media Capture API？我似乎只能找到检测getUserMedia()支持的解决方案。

我希望能够为移动用户提供以下两种方案之一：

• 用户的浏览器支持API，因此会显示两个上传按钮，一个激活相机，另一个激活图像库。
• 用户的浏览器不支持API，因此只显示一个上传按钮，如果浏览器支持accept参数，希望激活图库。

Answer 1

  

用户的浏览器支持API，因此会显示两个上传按钮，一个激活相机，另一个激活图像库。

现在没有办法（目前）创建2个单独的HTML按钮：一个用于（仅）库和＆amp;一个（只）相机（ 我已经介绍了this article）

中所有可能的HTML媒体捕获选项

使用  <input type="file" accept="image/*;">，系统会提示您选择拍摄照片或选择现有照片：

  

用户的浏览器不支持API，因此只显示一个上传按钮，如果浏览器支持接受参数，希望激活图库

支持如下：

• Android 2.2+和iOS6.0 +支持上述代码
• Android 3.0+支持capture并将用户直接带到相机
• iOS6到10不支持capture（始终显示提示）
• 桌面浏览器不支持HTML媒体捕获

检测支持恢复以检测上述浏览器。

支持参考：this 2013 O'Reilly book和my testing

Answer 2

您可以使用modernizr，on the docs page在table of features supported and detected中看到他们同时检测到HTML Media Capture和getUserMedia