如何在HTML5视频源类型属性中指定HEVC编解码器?

时间:2017-11-18 21:44:11

标签: html5 video ffmpeg safari hevc

我想在支持它的网页浏览器上加载和播放较小的HEVC编码视频。

我在Safari 11(macOS 10.13)上使用此代码,它支持HEVC格式。

<video muted playsinline autoplay>
    <source src="clip.webm" type="video/webm; codecs=vp9">
    <source src="clip-hevc.mp4" type="video/mp4; codecs=hevc">
    <source src="clip.mp4" type="video/mp4; codecs=avc1">
    <p>Video not supported</p>
</video>

在Web Inspector中>网络面板,我看到Safari加载了clip.mp4clip-hevc.mp4。如果我检查视频元素,我会看到clip.mp4正在播放,而不是clip-hevc.mp4。我在iOS 11上看到了同样的事情。

当我在我指定的类型上调用HTMLMediaElement.canPlayType()时,我得到了

  • maybe video/mp4; codecs=hevc
  • probably video/mp4; codecs=avc1
  • 我见过的HEVC编解码器变种没有(例如hvc1hev1

我注意到的其他事项:当我删除clip.mp4选项时,clip-hevc.mp4下载并播放就好了!

如何确保只有最受支持的MP4版本才会在浏览器中下载和播放?

1 个答案:

答案 0 :(得分:1)

在iOS14 type="video/mp4; codecs=hevc"中发现的FYI不再起作用。 type="video/mp4"type="video/mp4; codecs=hvc1"确实enter image description here