浏览器调用摄像头进行拍照程序

 <div style="width: 100%;height: 490px;">
        <div id="phone">
            <video id="video" width="480" height="360" autoplay></video>
        </div>
        <div class="showphone">
            <canvas id="canvas" width="480" height="360"></canvas> 
        </div>
 </div>
 <div>
     <form method="post" id="formsrc" enctype="multipart/form-data">
    <input type="hidden" value="" id="imgsrc" name="imgsrc">
    </form>
    <button id="snap">点击验证</button>
 </div>

js代码部分

    <script type="text/javascript">
        var canvas = document.getElementById("canvas");
        var context = canvas.getContext("2d");
        var video = document.getElementById("video");
        var imgsrc = document.getElementById("imgsrc");
        $(document).ready(function() {
            videoObj = {
                "video": true
            };
            var errBack = function(error) {
                console.log("Video capture error: ", error.code);
            };
            if (navigator.getUserMedia) { // Standard
                navigator.getUserMedia(videoObj, function(stream) {
                    video.srcObject = stream;
                    video.play();
                }, errBack);
            } else if (navigator.webkitGetUserMedia) { // WebKit-prefixed
                navigator.webkitGetUserMedia(videoObj, function(stream) {
                    video.src = window.webkitURL.createObjectURL(stream);
                    video.play();
                }, errBack);
            } else if (navigator.mozGetUserMedia) { // Firefox-prefixed
                navigator.mozGetUserMedia(videoObj, function(stream) {
                    video.src = window.URL.createObjectURL(stream);
                    video.play();
                }, errBack);
            };
            $("#snap").on("click", function() {
                context.drawImage(video, 0, 0, 480, 360);
                // console.log(canvas.toDataURL('jpg'))
                var sr=canvas.toDataURL('jpg');
                var src= sr.replace(/^data:image\/\w+;base64,/, "");
                imgsrc.value=src;
                staticTest(src);
            });
        });
    </script>

简单说一下，因为时间很紧的缘故。这段代码是去年忘记什么时候尝试写的一个基于浏览器的人脸识别的项目，遗憾的是因为某些缺陷没有进行到最后，不过这块可以拆分下来，留作纪念。

本作品采用《CC 协议》，转载必须注明作者和本文链接