<video> Safari 中的标记 - Safari 无法使用编解码器 x265 播放视频

Question

我正在使用 React Nextjs 播放视频

<video
    src="/video_x265.mp4"
    autoPlay
    muted
    loop
    playsInline>
</video>

视频无法在Safari（版本16.2（16614.3.7.1.7、16614））中播放。

经过一段时间的工作，我意识到 Safari 无法播放具有编解码器 x265 的视频。我通过回调源视频修复了它。

<video
    className="object-cover w-full h-[60vh] sm:h-fit"
    autoPlay
    muted
    loop
    playsInline>
    <source
        src="/video_x265.mp4"
        type="video/mp4; codecs=avc1"
    />
    <source
        src="/video_x264.mp4"
        type="video/mp4; codecs=hvc1"
    />
</video>

它工作正常，但我不明白为什么。在解决问题时，我看到了这篇文章Safari 13 上 HEVC/H.265 视频格式的浏览器兼容性，它告诉我们 x265 视频在 Safari 版本 16 中得到完全支持。

我使用 FFmpeg 来编码视频。这是视频的信息。

video_x264.mp4

Metadata:
    major_brand     : isom
    minor_version   : 512
    compatible_brands: isomiso2avc1mp41
    encoder         : Lavf60.3.100
  Duration: 00:01:26.15, start: 0.000000, bitrate: 2046 kb/s
  Stream #0:0[0x1](und): Video: h264 (High) (avc1 / 0x31637661), yuv420p(tv, bt709, progressive), 1280x720 [SAR 1:1 DAR 16:9], 1907 kb/s, 30 fps, 30 tbr, 15360 tbn (default)
    Metadata:
      handler_name    : Core Media Video
      vendor_id       : [0][0][0][0]
      encoder         : Lavc60.3.100 libx264
  Stream #0:1[0x2](und): Audio: aac (LC) (mp4a / 0x6134706D), 44100 Hz, stereo, fltp, 131 kb/s (default)
    Metadata:
      handler_name    : Core Media Audio
      vendor_id       : [0][0][0][0]

video_x265.mp4

 Metadata:
    major_brand     : isom
    minor_version   : 512
    compatible_brands: isomiso2mp41
    encoder         : Lavf60.3.100
  Duration: 00:01:26.15, start: 0.000000, bitrate: 929 kb/s
  Stream #0:0[0x1](und): Video: hevc (Main) (hev1 / 0x31766568), yuv420p(tv, bt709, progressive), 1280x720 [SAR 1:1 DAR 16:9], 789 kb/s, 30 fps, 30 tbr, 15360 tbn (default)
    Metadata:
      handler_name    : Core Media Video
      vendor_id       : [0][0][0][0]
      encoder         : Lavc60.3.100 libx265
  Stream #0:1[0x2](und): Audio: aac (LC) (mp4a / 0x6134706D), 44100 Hz, stereo, fltp, 131 kb/s (default)
    Metadata:
      handler_name    : Core Media Audio
      vendor_id       : [0][0][0][0]

我想知道上面的问题是怎么发生的

Answer 1

我找到了这个

iOS 上的 Safari 支持低复杂度的 AAC 音频、MP3 音频、AIF 音频、WAVE 音频和基线配置文件 MPEG-4 视频。桌面上的 Safari（Mac OS X 和 Windows）支持已安装版本的 QuickTime 支持的所有媒体，包括任何已安装的第三方编解码器。

在doc

简而言之，Safari iOS 支持低复杂度媒体，Safari MacOS 支持依赖于 QuickTime Player 的媒体。

出现上述问题的 Mac 设备在 macOS Big Sur，版本 11.7.1 中。哪个有QuickTime Player本身仍然有问题。

QuickTime Player 拒绝播放某些 H.265/HEVC 风格（以及 Final Cut Pro 10.6）。目前 macOS 11-12 Big Sur 和 Monterey 更宽容，但它们在“编解码器 ID”和“色度子采样”选项方面仍然存在以下问题。

Quicktime 讨论

所以我们需要为低复杂度的媒体添加回退源来支持案例。