如何禁用视频标签上的自动海报图像生成？

【问题标题】：How do I disable auto- poster image generation on the video tag?如何禁用视频标签上的自动海报图像生成？
【发布时间】：2010-06-17 15:09:16
【问题描述】：

我在视频标签上使用了“海报”属性，它似乎至少在 webkit 浏览器中的工作方式是它加载海报图像，然后一旦加载了足够多的视频，它就会将该海报替换为从视频文件本身自动生成的海报。

但是，我的海报图片与自动生成的海报不匹配，这导致加载一张图片的奇怪体验，然后在几秒钟内被自动生成的图片替换。有什么办法可以防止自动生成的图片被使用？

【问题讨论】：

【解决方案1】：

我们设法在JW Player for HTML5 中解决了这个问题。最简单的方法如下：

这可以正常工作，但它仍然意味着您在回放时会遇到问题，因为重新出现的海报图像不会与原始图像相同，除非您使用更多的 JS 魔法。

另外值得注意的是，您不能在移动 Safari 中的

【讨论】：

【解决方案2】：

这是 webkit 浏览器决定实现规范的方式（如上所述）。我同意你的观点，它不是很直观，我自己也希望保持海报图像直到用户点击播放按钮。我建议您向 webkit 提交错误报告（或功能请求）https://bugs.webkit.org/。

【讨论】：

【解决方案3】：

唯一的选择是确保视频的第一帧与海报相同或根本不使用它。

“当视频元素暂停并且当前播放位置是视频的第一帧时，该元素代表与当前播放位置相对应的视频帧或后帧，由用户代理决定。” -- http://www.w3.org/TR/html5/video.html#attr-video-poster

【讨论】：