具有捕获和接受属性的HTML文件输入控件工作不正确？

Question

我的问题：然后，用户单击input type=file用户必须获得upload file + camera对话框。我正在使用此html属性accept和capture。但是在某些现代设备上，这不会发生。下面有代码示例和下表，说明其正常工作与否。代码示例在Mobile Safari和中进行了测试Chrome。W（ork）-启用 upload image dialog with cameraP（人工工作）-启用 upload dialog(not image only) with cameraN（ot work）- only camera启用Ch-均值 ChromeMS-平均值 Mobile Safari＃--------------------------------------------------------------------------------|devices/example   | Ch 1| Ch 2| Ch 3| Ch 4| Ch 5| MS 1| MS 2| MS 3| MS 4| MS 5| --------------------------------------------------------------------------------|Samsung S3/4.1    |  N  |  N  |  P  |  P  |  W  |  W  |  N  |  P  |  P  |  W  |--------------------------------------------------------------------------------|Samsung S3/4.3    |  N  |  N  |  P  |  P  |  P  |  N  |  N  |  P  |  P  |  P  |--------------------------------------------------------------------------------|Samsung Galaxy Tab|  N  |  N  |  P  |  P  |  W  |  W  |  N  |  P  |  P  |  W  |--------------------------------------------------------------------------------|Samsung Note      |  N  |  N  |  P  |  P  |  W  |  W  |  N  |  P  |  P  |  W  |--------------------------------------------------------------------------------|iPhone 5          |  W  |  W  |  P  |  P  |  W  |  W  |  Y  |  P  |  P  |  W  |--------------------------------------------------------------------------------|Nexus 4           |  N  |  N  |  P  |  P  |  W  |  -  |  -  |  -  |  -  |  -  |--------------------------------------------------------------------------------如您所见，我只能upload file + camera使用<input type="file" accept="image/*">只要。但是capture在这种情况下没有属性，这让我感到担忧，并且Android 4.3出现了问题。我的问题是：表中的行为是真的吗？Android 4.3的行为是否有错误？我是否可以信任浏览器，它将始终添加摄像头以上传没有捕获属性的对话框？（请添加证明链接以获得答案）谢谢。PS Question非常特殊，但是在我的网站上，我必须为用户提供访问其图像和照相机的权限。另外，我认为我的桌子对任何人都可能有帮助，并且如果没有人回答，我也会寻找答案并将其张贴在这里。

Answer 1

这是实际答案。只需将其发布在这里供下一个用户使用：

实际上，当前的实现似乎根本不依赖于capture属性，而仅依赖于type和accept属性：浏览器显示一个对话框，用户可以在其中选择文件的获取位置，以及该capture属性不考虑在内。例如，iOS Safari依赖于图像和视频（非音频）的accept属性（非捕获）。即使您不使用该accept属性，浏览器也会让您在“拍摄照片或视频”和“选择现有”之间进行选择（感谢@firt指出这一点）。

Answer 2

“正确”的代码和您应该使用的代码是第五个代码：

<input type="file" accept="image/*">

这就是为什么它在大多数设备上都能正常工作的原因。上面的代码正确，完整，足以告诉iOS和Android：

您要捕获图像（accept="video/*"用于视频和 accept="audio/*"音频，请完全跳过以允许任何操作）。

用户应该能够选择现有的一个或当场捕获它

我是否可以信任浏览器，它将始终添加摄像头以上传没有捕获属性的对话框？

是。

该capture属性不是用来在对话框中包括camera选项的（<input type="file">足够了），而是指示首选从网络摄像头直接捕获。根据W3C建议规范：

capture属性是一个布尔属性，如果指定，则指示直接从设备捕获媒体是首选。

capture受Android 3.0+支持，如果capture代码中存在，它将直接带您进入相机应用。

iOS6-10中不提供支持，该支持将始终为您提供至少两个选项：“拍照” +“照片库”。

该capture属性在规范中得到了发展（这就是为什么您在整个StackOverflow中都会看到多个版本的原因）：

2010年7月： accept="image/*;capture=camera"

2011年4月：（capture="camera"字符串）

2012年12月：（capture布尔值，W3C候选推荐标准，）

PS：我已经对HTML Media Capture进行了大量研究，请参见HTML9 Media Capture的正确语法和iOS9中Media Capture 的新提示。这是我的测试平台，具有20多种代码组合。