我有一个可以播放视频的网络应用程序。
我正在考虑使用 HTML5 <video>元素并确定它将允许我满足我的所有要求，除了一个:允许用户拍摄当前视频帧的快照并将其保存为光栅图像格式(即 JPG)。
对于这个要求，我还没有找到解决方案，非常感谢任何关于此事的指导。
为了帮助回答这个问题，这里提供了更多详细信息。我将通过 HTTP 从服务器下载视频文件，然后在浏览器中播放它们。这将不是视频流，而是在收到文件后开始播放的下载。视频将采用 MP4 格式。
该解决方案只需要在 IE 9 中运行。(尽管我自然希望该解决方案尽可能跨浏览器/平台。)
最佳答案
将图像捕获到 canvas 元素:
var video = document.getElementById(videoId);
var canvas = document.createElement('canvas');
canvas.width = video.videoWidth;
canvas.height = video.videoHeight;
var ctx = canvas.getContext('2d');
ctx.drawImage(video, 0, 0);
然后使用 toDataURL()获取图片的方法:
canvas.toDataURL('image/jpeg');
请注意，所有这些都可以正常工作 the video has to be from the same origin as the page .
关于html - 捕获视频帧然后在 HTML5 中导出为位图，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/5372501/