html - <link rel=preload> 必须有一个有效的 `as` 值

Question

我正在尝试根据 mdn's documentation on preload 使用 link 标签的预加载 rel 值预加载视频.

在我的 index.html 文件中，我将以下内容添加到头部:

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

在 chrome 中，这工作正常并且可以毫无问题地预加载文件。

当我在桌面或 iPhone 上打开 safari 11.3 中的页面时，我收到一条控制台错误消息:

must have a valid as value

根据"what types of content can be preloaded"包含有效值列表的文档部分 我肯定使用了正确的 video 类型。

我检查了 mdn documentation对于链接标签上的移动 Safari 预加载选项，它显示“兼容性未知”问号。我还检查了caniuse它似乎表明只要我的移动版 safari 版本是 11.3，我就应该能够使用它。

手机和我的桌面都在 safari 11.3，所以我不确定为什么会收到此错误。

任何想法/见解？？

Answer 1

似乎 webkit 禁用了视频和音频文件的预加载。

if (RuntimeEnabledFeatures::sharedFeatures().mediaPreloadingEnabled() && (equalLettersIgnoringASCIICase(as, "video") || equalLettersIgnoringASCIICase(as, "audio")))
    return CachedResource::MediaResource;
if (equalLettersIgnoringASCIICase(as, "font"))
    return CachedResource::FontResource;
#if ENABLE(VIDEO_TRACK)
if (equalLettersIgnoringASCIICase(as, "track"))
    return CachedResource::TextTrackResource;
#endif
return std::nullopt;

https://github.com/WebKit/webkit/blob/master/Source/WebCore/loader/LinkLoader.cpp#L125

auto type = LinkLoader::resourceTypeFromAsAttribute(as);
if (!type) {
    document.addConsoleMessage(MessageSource::Other, MessageLevel::Error, String("<link rel=preload> must have a valid `as` value"));
    return nullptr;
}

https://github.com/WebKit/webkit/blob/master/Source/WebCore/loader/LinkLoader.cpp#L239-L243

我不确定我们是否可以通过更改一些配置在 safari 上启用 mediaPreloadingEnabled。