HTML5 drawimage從視頻到畫布

Question

我試圖從視頻中捕獲一幀並使用HTML5在畫布中繪製它，但下面的代碼不起作用。當我點擊開始按鈕畫布充滿了黑色

<video src="video2.mp4" autoplay="true" type="video/mp4" width="300" height="200" id="vid"> 
     </video> 
     <canvas id="cvs"> </canvas> 
     <button onclick="start()">Start</button> 
     <script> 
     var video=document.getElementById("vid"); 
     var cvs=document.getElementById("cvs"); 
     function start(){ 
     cvs.getContext("2d").drawImage(video, 0, 0, 300,200); 
     } 
</script> 

Answer 1

我有完全相同的問題，我認爲它必須與視頻格式。我的視頻是在.mp4容器中的H264。當我使用.ogg視頻時，完全相同的代碼完美地工作。 我使用Romin提供的鏈接中的代碼。