小编Ian*_*ard的帖子

JavaScript:可靠地提取视频帧

我正在开发一个客户端项目,它允许用户提供视频文件并对其应用基本操作.我正在尝试可靠地从视频中提取帧.目前我有一个<video>我正在加载所选视频,然后按如下方式拉出每个帧:

  1. 寻求开始
  2. 暂停视频
  3. <video>到一个<canvas>
  4. 用画布从画布中捕捉帧 .toDataUrl()
  5. 向前搜索1/30秒(1帧).
  6. 冲洗并重复

这是一个相当低效的过程,更具体地说,证明是不可靠的,因为我经常遇到卡住的帧.这似乎是因为它不会<video>在绘制到画布之前更新实际元素.

我宁愿不必将原始视频上传到服务器只是为了分割帧,然后将它们下载回客户端.

任何有关更好的方法的建议都非常感谢.唯一需要注意的是,我需要它使用浏览器支持的任何格式(在JS中解码不是一个很好的选择).

javascript video html5 canvas

23
推荐指数
3
解决办法
2万
查看次数

标签 统计

canvas ×1

html5 ×1

javascript ×1

video ×1