Html5视频帧准确

Question

我正在尝试获取html5视频标记源元素以返回准确的帧编号.stackoverflow
附近的东西回答.
我的目标是显示准确的时间码.我一直在关注VideoFrame和其他许多人,但没有一个是准确的.如果你播放一个包含刻录时间码或帧数的视频,就像我正在使用的那个视频_keyframes12_24p_Mbits1.8.mp4我自己做的那个.你最终会看到一帧.

任何人都有这个暗示吗？
非常感谢!

Answer 1

问题

不幸的是，没有框架 API 可供我们使用 - Firefox 有一些实验性功能，但除此之外我们只能处理时间以及浏览器如何处理帧解码以及帧速率转换。请参阅下文了解更新。

例如，浏览器可能或可能总是转换/标准化为 30 fps，如果是这样，可能会或可能不会假设丢帧（对于 29.97/59.94 fps/NTSC）。随着时间的推移，这将影响帧计数，并最终显示为偏移，因为时间和帧计数之间没有真正的联系。

此外，由于基于整数的转换，并且还可能取决于视频中的开始位置，可能会出现舍入误差。根据浏览器的不同，视频的底层解码方式也有不同的解决方案，例如，Chrome 在底层使用 FFMpeg，Firefox 使用 OS* 中可用的任何内容（对于 MP4 编码视频）等等。

可能的解决方案

（更新：忘了提及 -）有支持该对象的媒体源扩展 API。目前 [Chrome 和 IE（Windows 8+）以及 Firefox 均支持此功能。VideoPlaybackQuality

要使用，您可以直接在 HTMLVideoElement 上调用它：

var q = video.getVideoPlaybackQuality();

然后使用其属性读出值：

var frames = q.totalVideoFrames;

请注意，无论实际播放位置如何，该值都可能会累积所有帧。您也许可以直接使用 MSE 来解决这个问题。设置和处理起来有点乏味，但如果您不熟悉 MSE，此链接提供了一个很好的起点。

另一种想法是在视频中编码特殊的条形码，然后使用画布读取它。这在实际的 SMPTE 时间码上是等效的，但这需要在某种程度上在视频中可见覆盖（就像将图文电视编码到视频过扫描区域的旧方法一样）。如果视频是全帧的，则会出现其他问题，例如根据用于编码的颜色（或为其制作纯色背景）进行错误检测。

^*) 在 Cisco 免费发布其 mp4 解决方案后，最近的版本可能有所更改。