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

nfr*_*ser 5 html safari video ffmpeg hevc

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

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

<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>
Run Code Online (Sandbox Code Playgroud)

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

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

  • maybevideo/mp4; codecs=hevc
  • probablyvideo/mp4; codecs=avc1
  • 我见过的 HEVC 编解码器的变体没有任何内容(例如hvc1,,hev1

我注意到的其他事情:当我删除该clip.mp4选项时,clip-hevc.mp4下载和播放都很好!

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

Rob*_*aly 4

仅供参考,iOS14 中type="video/mp4; codecs=hevc"不再起作用。type="video/mp4"并且type="video/mp4; codecs=hvc1"确实在此输入图像描述