如果我们在 type 属性中定义编解码器，Chrome 将不会播放 AV1 编码的文件 - 但如果我们忽略它，则无法播放 AV1 的浏览器会失败

编程问答 2022-06-02

问题描述

我有点不知该如何解决这个问题。

我们有一个 AV1 编码的 MP4 文件，我们有一些用于旧浏览器的后备文件。只有我们遇到了这个问题：

如果我们确实定义了编解码器：桌面版 Chrome 不会播放 AV1 文件 - 它使用回退

如果我们不定义编解码器：桌面版 Chrome 将播放 AV1 文件，但不支持 AV1 的移动浏览器将尝试播放该文件但失败，而不是使用回退.

我们已经尝试过：

  • type="video/mp4"（移动播放失败）
  • type="video/mp4; codecs=av01"（所有浏览器都使用后备，忽略 AV1 文件）
  • type="video/mp4; codecs=av01.1.04M.08.0.000.02.02.02.02.0"（所有浏览器都使用后备，忽略 AV1 文件）(Source for that string)

我们使用的实际 HTML 源代码是这样的：

<video muted="" loop="" preload="Metadata">
    <source src="./demo-av1.mp4#t=0" type="video/mp4; codecs=av1">
    <source src="./demo.webm#t=0" type="video/webm">
    <source src="./demo-x264.mp4#t=0" type="video/mp4">
</video>

解决方法

您是否仅尝试使用 av01.1.04M.08（从我所看到的 here 来看，其他东西似乎是可选的）？

我刚刚尝试了这样的视频：

<video muted="" loop="" preload="metadata">
    <source src="./demo-av1.mp4#t=0" type="video/mp4; codecs=av01.0.05M.08,opus">
    <source src="./demo.webm#t=0" type="video/webm">
    <source src="./demo-x264.mp4#t=0" type="video/mp4">
</video>

...并对其进行了测试：

  • Chrome - 加载 AV1
  • Safari - 加载后备视频而不加载任何 AV1 资源（如果您根本跳过编解码器字符串，Safari 仍然使用后备，但在网络选项卡中，您可以看到它加载了 AV1 文件的一部分）。

Source for that codecs string

codecgoogle-chromehtml5-videoplaybackvideo