Question

我有一个关于从浏览器访问相机的问题。（Android和iOS浏览器）

谷歌和苹果公司在1年前宣布，从浏览器到相机的访问应尽快推出。

我需要这个功能用于移动Web应用程序。

此功能现在可用吗？

Answer 1

尝试以下方法：

<html>
<body>
<form>
<input type="file" accept="image/*;capture=camera"/>
<input type="submit"/>
</form>
</body>
</html>

Answer 2

我确实使用了输入，正如他们在这里所说的那样，并且在iOs上工作得非常好。我可以从相机或相册中获取图片并设置img元素。

以下是代码：http://jsfiddle.net/2wZgv/

js：

<script>

    oFReader = new FileReader();

    oFReader.onload = function (oFREvent) {     
        document.getElementById("fotoImg").src = oFREvent.target.result;
        document.getElementById("fotoImg").style.visibility = "visible"; 
        var screenHeight = screen.availHeight;
        screenHeight = screenHeight - 220;
        document.getElementById("fotoImg").style.height = screenHeight;
    };

    $(function() {
        $("input:file").change(function (){
            var input = document.querySelector('input[type=file]');
            var oFile = input.files[0];
            oFReader.readAsDataURL(oFile);  
        });
    });

</script>

picture photo album mobile jquery camera

Answer 3

这是w3c draft

阅读后，输入标签应为

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

Answer 4

试试这个。

<video id="Video" autoplay="autoplay" audio="muted" width="100%" height ="100%"> </video>

<script type="text/javascript">
if (navigator.getUserMedia) {
    var video = document.getElementById('Video');
    video.src = null;
    navigator.getUserMedia('video', successCallback, errorCallback);
    //if everything if good then set the source of the video element to the mediastream
    function successCallback(stream) {
        video.src = stream;
    }
    //If everything isn't ok then say so
    function errorCallback(error) {
        alert("An error occurred: [CODE " + error.code + "]");
    }
}
else {
    //show no support for getUserMedia
    alert("Native camera is not supported in this browser!");
}
</script>

但请记住，这只适用于Opera Mobile for Android。目前没有其他浏览器支持摄像头访问。据我所知，iOS现在不支持此功能，可能在将来。

谢谢。

Answer 5

这是可能的。您可以通过浏览器应用程序访问相机。如果您正在通过手机差距进行开发，请查找http://docs.phonegap.com/phonegap_camera_camera.md.html

这是PhoneGap中用于访问摄像头的摄像头API。

从浏览器访问相机

5 个答案: