跨设备照片捕获上传

Question

由于iOS6 Mobile Safari浏览器用户可以通过相机或相册从他们的设备上传图像。

Web开发人员只需编写绑定文件输入标记的上载脚本，如下所示：

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

这会提示iOS用户选择图像源（图像文件或相机），然后将图像上传到服务器。像这张图片中的东西。

这适用于使用Mobile Safari的iOS，但我想在Windows Phone，Android以及iOS iPhone和iPad中使用相同的行为。

每种设备都有类似的HTML规范吗？

您可以使用this提供的Chris Droukas链接来尝试。

谢谢。

修改

我有机会在Android 4.2和iOS6上尝试<input type="file" accept="image/*" capture="camera">，并允许用户拍照（或选择一张）并提交。

有更多设备的人可以告诉我这是否适用于他们？

Answer 1

根据this chart，HTML Media Capture可在以下移动平台上使用：

  

iOS Safari ：6.0及更高版本

     

Android浏览器：3.0及更高版本

     

Google Chrome ：4.0及更高版本

     

BlackBerry Browser ：BB10

     

Opera Mobile（Android＆amp; Symbian）：14.0及更高版本

     

Firefox（Android，MeeGo）：11.0及更高版本

Windows Phone上的Internet Explorer似乎不支持它。您可以在不同的设备here上进行测试。

Answer 2

使用PhoneGap：

<script type="text/javascript" charset="utf-8" src="phonegap-1.1.0.js"></script>

<script>
function takePicture() {
    navigator.camera.getPicture(
        function (uri) {
            var img = document.getElementById('camera_image');
            img.style.visibility = "visible";
            img.style.display = "block";
            img.src = uri;
            document.getElementById('camera_status').innerHTML = "Success";
        },
        function(e) {
            console.log("Error getting picture: " + e);
            document.getElementById('camera_status').innerHTML = "Error getting picture.";
        },
        { quality: 50, destinationType: navigator.camera.DestinationType.FILE_URI});
};
</script>


<input type="button" onclick="takePicture();" value="Take Picture" /><br/>