在HTML5视频的元数据中，帧率（fps）保存在哪里？

Question

为了完全实现我的自定义HTML5视频播放器，我需要知道视频的确切帧率。然而，我还没有找到它，所以我正在使用标准值25。通常视频的元数据中包含帧率值，因此我使用类似以下代码来访问元数据：

为了完全实现我的自定义HTML5视频播放器，我需要知道视频的确切帧率。然而，我还没有找到它，所以我正在使用标准值25。通常视频的元数据中包含帧率值，因此我使用类似以下代码来访问元数据：

var vid = document.getElementById("myVideo");
vid.onloadedmetadata = function(e) {
console.log(e);
};

然而我在这里找不到帧速率。也许我根本没有读取元数据。 我需要你的帮助。 谢谢！

- Hasan Wajahat

Answer 1

尝试使用https://mediainfo.js.org（github）

它仅适用于ui，不需要后端

我刚刚实现了它，并且看起来它可以完美地工作（至少在Chrome v 70.0.3538.77中），以获取广泛的媒体信息

现代浏览器似乎开始使用一些二进制库

- qiAlex

---

刚刚浪费了整个上午，.js文件很小，但是它却获取了一个2.5MB的.wasm文件来完成工作。哎呀。 - Brian Klug

这个库能否用于远程文件？ - dfranca

Answer 2

我95%确定标准的HTML5视频API不会公开FPS信息，从我在过去几个月中所读到的内容来看，其他API（如MPEG-DASH和jwplayer）提供更多/不同的数据。

你最好搜索w3schools.com/tags/ref_av_dom.asp和类似的MDN页面。

你可以自己实时计算这个值，并且大部分时间都可以工作，但我可以想象有一两种情况下它可能不起作用。查看PresentedFrames，然后执行以下操作：

fps = video.time / PresentedFrames

查看有关PresentedFrames 此处（目前为建议）以及同类属性的更多信息，请访问链接。

- 8eecf0d2

---

谢谢，我也认为在HTML视频元素中很难将fps作为属性给出。我只是希望它能有这个属性。 我喜欢你给出的解决方案，但是如何计算PresentFrames呢？因为测量帧数的方法是使用fps和当前时间。 还有其他方法可以找到PresentFrames吗？ - Hasan Wajahat

@HasanWajahat 我已经更新了我的答案，并提供了一个文档，其中记录了许多不同的属性，这些属性在计算 fps（特别是 PresentedFrames）时可能会很有用。 - 8eecf0d2

感谢分享， 不幸的是，Chrome尚未实现presentedFrames。Mozilla已经这样做了，但我需要它用于Chrome。 - Hasan Wajahat

playbackRate 是什么意思？ - Muhammad Umer

我正在尝试推进时间索引并在画布上进行渲染，以查看在哪个时间点发生了变化，但是它无法正常工作，因为我正在使用file://运行，它不允许我查看像素！ - Michael

@MuhammadUmer playbackRate 是一个实数，表示播放速度比流帧率建议的速度更快（大于1.0的值）或更慢（小于1.0的值）。 - Armen Michaeli

Answer 3

mediainfo.js 的表现相当不错 - 即使在本地浏览器中使用 'http(s)://' 也是如此。

要在本地使用它，只需确保您还下载了附带的 mediainfo.wasm 并将其放入与mediainfo.min.js相同的目录中。

或者，您可以使用 npm 安装 media-info。

唯一的注意事项是，它无法从 'file://' 协议运行。

- Andy