使用 <link rel="preload"> 在 HTML 中预加载 m3u8 视频答案

【问题标题】：Preloading an m3u8 video in HTML with <link rel="preload">使用 <link rel="preload"> 在 HTML 中预加载 m3u8 视频
【发布时间】：2018-08-18 16:03:01
【问题描述】：

我正在使用<link rel="preload"> 属性来预加载我的视频以加快播放速度。

但我的视频是一个.m3u8 文件，它是一个链接到多个分块的.ts 文件的播放列表文件。

为了成功预加载我的视频，我应该链接到播放列表文件

<link rel="preload" as="video" href="https://cdn.com/file.m3u8">

或

像这样链接到源文件：

<link rel="preload" as="video" href="https://cdn.com/file1.ts">
<link rel="preload" as="video" href="https://cdn.com/file2.ts">
<link rel="preload" as="video" href="https://cdn.com/file3.ts">

【问题讨论】：

您应该喜欢 m3u8，因为您希望浏览器在运行时确定用户可以支持流式传输的带宽。如果您的 m3u8 格式正确并表明它是一个 VOD 文件，那么某些浏览器将尝试从 <video preload="auto" src="...m3u8"> 预加载片段
谢谢，你是对的。回答，所以我可以接受..

标签： html video media http-live-streaming m3u8

【解决方案1】：

您应该从<video> 标记链接到 m3u8，因为您希望浏览器在运行时确定用户可以支持的流式传输带宽。

如果您的 m3u8 格式正确并表明它是一个 VOD 文件（而不是实时流），那么某些浏览器会尝试从 a 预加载片段 - 在大多数情况下更好地使用它们的逻辑。

【讨论】：