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提供的链接中的代码。