輸入類型的文件捕捉相機限制視

Question

試圖限制攝像機捕捉，當我點擊輸入按鈕，我看到的是camera without frame什麼，我想看到的是camera with frame and custom text

Answer 1

的從規格（actually it's coming back from the deads）<input>capture下降使用操作系統的相機輸入。

由於它就像一個普通的文件選取器，在用戶發送給您之前，您無法訪問它。

做你想做什麼，你必須使用getUserMedia API，這仍然沒有在Safari支持...

navigator.mediaDevices.getUserMedia({video: true}) 
 
    .then(stream => { 
 
    vid.srcObject = stream; 
 
    vid.play(); 
 
    }); 
 
vid.onloadedmetadata = e => { 
 
    overlay.style.left = (vid.videoWidth/2 - 150) + 'px'; 
 
    overlay.style.top = (vid.videoHeight/2 - 75) + 'px'; 
 
    };

#overlay{ 
 
    border: 1px solid white; 
 
    background: rgba(255,255,255,.5); 
 
    position: absolute; 
 
    width: 300px; 
 
    height: 150px; 
 
    }

<video id="vid" autoplay></video> 
 
<div id="overlay"></div>

作爲Fiddle鉻。