Question

我正在尝试使用链接标签的预加载rel值预加载视频。 Documentation here。在index.html文件中，我将以下内容添加到头部：

<link rel="preload" as="video" type="video/mp4" href="foo.mp4" />

即使根据规范，video是有效的as值，我仍在最新的Chrome浏览器中收到以下控制台错误。

<link rel=preload> must have a valid "as" value

我发现了this unresolved Chrome bug，但这是指另一个用例。是否可以通过这种方式预加载视频？

Answer 1

您可以使用 here

中的一段代码在浏览器中对此进行测试

function preloadFullVideoSupported() {
  const link = document.createElement('link');
  link.as = 'video';
  return (link.as === 'video');
}

or

function preloadFirstSegmentSupported() {
  const link = document.createElement('link');
  link.as = 'fetch';
  return (link.as === 'fetch');
}

不幸的是，我找不到任何文档来支持预加载时每个浏览器的单个 as="X" 值。

Answer 2

截至 2021 年 7 月 13 日，https://developer.mozilla.org/en-US/docs/Web/HTML/Link_types/preload 有一条大约 1/3 的注释，上面写着“注意：视频预加载包含在预加载规范中，但浏览器目前尚未实现。”也许这就是您看到此警告的原因（我也看到了）？如果是这样，那么不，不可能使用预加载。

视频预加载：<link rel = preload>在Chrome中必须具有有效的as值

2 个答案: