使用HTML File Input在移动设备调用相机遇Android兼容问题

针对你用<input type="file" accept="image/*" capture="environment"/>在iOS正常但Android打开文件浏览器的问题，可通过以下几种方式适配：

1. 细化accept属性的MIME类型 #

将宽泛的image/*替换为具体的图片格式，部分Android浏览器对精准的MIME类型识别优先级更高，会优先唤起相机而非文件浏览器。修改后代码：

<input type="file" accept="image/jpeg,image/png" capture="environment"/>

2. 移除capture属性，让系统弹出选择菜单 #

部分旧版Android浏览器对capture="environment"的支持不完善，移除该属性后，系统会弹出包含相机、文件选择等选项的弹窗，用户可手动选择相机：

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

3. 替换capture属性值为camera #

Chrome等主流Android浏览器对capture="camera"的兼容性比environment更好，该值同样会唤起后置摄像头（部分设备会自动适配）：

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

4. 尝试添加multiple属性（按需使用） #

部分Android浏览器在存在multiple属性时，会优先展示相机选项，不过该属性允许选择多张图片，需根据业务场景决定是否使用：

<input type="file" accept="image/*" capture="environment" multiple/>

注意：不同Android厂商的定制浏览器行为可能存在差异，建议在Chrome、Firefox及主流厂商自带浏览器中分别测试，确保覆盖多数用户场景。

内容的提问来源于stack exchange，提问作者Vita Son