< link rel = preload>必须具有有效的"as"值 [英] <link rel=preload> must have a valid `as` value
问题描述
I'm trying to preload a video using the link tag's preload rel value per mdn's documentation on preload.
在我的index.html文件中，将以下内容添加到头部:
in my index.html file I'm adding the following to the head:
<link rel="preload" as="video" type="video/mp4" href="video/2_1.mp4" />
在chrome中，此方法工作正常，可以预加载文件而不会出现问题.
In chrome this works fine and preloads the file without issue.
当我在台式机或iphone上使用safari 11.3打开页面时，出现控制台错误消息:
When I open the page in safari 11.3 either on my desktop or on an iphone I get a console error message:
必须具有有效的
as值
根据可以预加载哪些类型的内容"包含有效值列表的文档部分肯定使用了正确的 video 类型.
According to the "what types of content can be preloaded" section of the documentation that contains the list of valid values I'm definitely using the correct video type.
我同时检查了 mdn文档链接标签上的移动Safari浏览器预载"选项，它会显示兼容性未知"问号.我还检查了 caniuse ，这似乎表明只要我的移动浏览器版本为11.3，我就应该能够使用它.
I checked both the mdn documentation for mobile safari preload option on the link tag and it shows a "compatibility unknown" question mark. I also checkedcaniuse and it seems to indicate that as long as my mobile safari version is at 11.3 I should be able to use it.
手机和我的台式机均位于safari 11.3中，所以我不确定为什么会出现此错误.
The phone and my desktop are both at safari 11.3, so I'm not sure why I'm getting this error.
任何想法/见识?
推荐答案
似乎webkit禁用了视频和音频文件的预加载.
it seems webkit disable preload for video and audio file.
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.com/WebKit/webkit/blob/master/Source/WebCore/loader/LinkLoader.cpp#L239-L243
我不确定是否可以通过更改某些配置在safari上启用mediaPreloadingEnabled.
I'm not sure if we can enable mediaPreloadingEnabled on safari by changing some configuration.
这篇关于< link rel = preload>必须具有有效的"as"值的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
