javascript - HTML 5 当前时间准确性

标签 javascript html video ffmpeg

我正在开发一个项目,我们使用视频元素的 currentTime 属性的值来使用 ffmpeg 在服务器后端执行处理。我遇到了一个问题,视频元素报告的时间码似乎与 ffmpeg 访问视频中正确点所需的时间码略有不同。

例如在 Firefox 中,如果 currentTime 属性报告当前视频时间是 26.83,我可能会发现我真正想要的帧在 26.72 结束,所以如果我使用时间在服务器上使用 ffmpeg 提取帧,我得到下一帧而不是当前帧。

偏移量似乎在视频的不同部分和不同的视频中略有不同。但在 Firefox 中,偏移量通常接近十分之一秒。在 chrome 中,currentTime 实际上似乎提前或正确的 currentTime 大约百分之五秒。在 IE 中更难找出偏移量,因为当我输入不同的时间码以查找帧变化的确切时间码时,帧移动的位置似乎发生了变化。

我很确定 ffmpeg 使用的时间是正确的时间。它似乎更接近于其他视频编辑软件,如 adobe premier。

关于可能导致此行为的原因有什么想法吗?

JS获取当前时间:

AVideo.prototype.getCurrentTime = function()
{
   return this.videoElement[0].currentTime;
};

生成的 ffmpeg 命令:

ffmpeg -y -i '/tmp/myVideo.mov' -vframes 1 -ss 2.4871 -f image2   -y '/tmp/myFrame.jpg' 2>&1

最佳答案

您在这里受到每个浏览器或播放器实现的支配,并且您也处于一个相当棘手的领域,因为视频中的时间很复杂,您可能会看到多个不同的时间被讨论。

一些例子是:

  • DTS - 解码时间戳,特定帧应该被解码的时间
  • PTS - 呈现时间戳,特定帧应呈现的时间。这很可能是您感兴趣的。
  • SMPTE - 媒体中使用的传统时间戳。在线视频链接的好例子:http://allensarkisyan.github.io/VideoFrameDocs/

从更高层次的 Angular 来看,视频通常会有一个设定的“每秒帧数”速率,尽管有时这可能是可变的以进一步混淆事物。即使它是常数,通常也很难提前计算它,因此如果您确实知道它(例如从视频的元数据),那将是一个优势。

假设 fps 恒定,那么首先要理解的是对于给定的帧速率(例如 25 fps),您没有足够的帧来提供精确到小数点后两位秒的时间戳。

换句话说,假设视频从 00:00:00.00 开始,那么第一帧理论上应该是 00:00:00.00,第二帧是 00:00:00.00 + 1/25 秒 -> 00 :00:00.04,下一帧在 00:00:00.08 等

因此,如果您要求播放器定位到 00:00:00.06,我们可以立即看到播放器有问题,因为它必须在两个最接近的帧 00:00:00.04 和 00:00:00.08 之间进行选择。在最坏的情况下,例如当电影中的场景发生变化时,这些帧可能看起来完全不同。

“帧准确”视频播放器可能对您更有用 - 即,如果您在某个地方暂停视频,那么知道那个地方的确切帧数可能会让您在执行操作时更好地对齐ffmpeg 操作。

这里有一篇关于此的不错的 BBC 博客文章,虽然有点旧:http://www.bbc.co.uk/blogs/bbcinternet/2011/02/frame_accurate_video_in_html5.html上面的 SMPTE 视频链接可能会给您一些有用的东西。

其他一些对帧准播放器有用的引用:

关于javascript - HTML 5 当前时间准确性,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32318333/

相关文章:

javascript - 两个具有 keyup 功能的输入字段

javascript - 使用 javascript 和 regex 检测多个 html 标签

css - div背景半透明,不是内容?

JavaScript addEventListener 暂停和播放视频

javascript - Jquery 在点击事件中排除第一个 td?

javascript - 全屏悬停注册框——如 squarespace 上所示

javascript - 在jqgrid中选择所有复选框的功能

javascript - 按当前浏览器 url 过滤 li 元素

android - 如何将 ffmpeg gl-transition 项目集成到我现有的项目中

javascript - 如何允许在页面上只播放一个嵌入的 YouTube 视频?