HTML5 - 訪問攝像頭

Question

我想使用HTML和JavaScript訪問攝像頭。 我見過this example，但它在Chrome中不起作用。 我也試過這個：

<img src=""> 
<video></video> 
<canvas style="display:none;"></canvas> 

<script> 
    var video = document.querySelector('video'); 
    var canvas = document.querySelector('canvas'); 
    var ctx = canvas.getContext('2d'); 
    var localMediaStream = null; 

    function snapshot() { 
    if (localMediaStream) { 
     ctx.drawImage(video, 0, 0); 
     // "image/webp" works in Chrome. 
     // Other browsers will fall back to image/png. 
     document.querySelector('img').src = canvas.toDataURL('image/webp'); 
    } 
    } 

    video.addEventListener('click', snapshot, false); 

    // Not showing vendor prefixes or code that works cross-browser. 
    navigator.getUserMedia({video: true}, function(stream) { 
    video.src = window.URL.createObjectURL(stream); 
    localMediaStream = stream; 
    }, errorCallback); 
</script> 

誰能幫忙？謝謝！

Answer 1

您缺少errorCallback功能。

function errorCallback(e) { 
    console.log(e); 
} 

我加了這一點，並得到了一個錯誤：

要訪問你必須有https userMedia。我試着運行它here (jsfiddle)併爲我工作。