我正在使用 <link> 预加载字体rel 属性设置为 preload 的 HTML 标记，如以下代码片段所示；
<link rel="preload" href="fonts/32ADEO.woff2" as="font" type="font/woff2">
虽然这通过加载字体按预期工作，但它会再次加载。
Google Chrome 浏览器中网络选项卡的屏幕截图显示字体加载两次 - 见下文；
此外，我在 Google Chrome 浏览器控制台选项卡中收到以下警告；
The resource https://example.com/new-v8/fonts/32A0E0.woff2 was preloaded using link preload but not used within a few seconds from the window's load event. Please make sure it Please make sure it has an appropriate 'as' value and it is preloaded intentionally.
我做错了什么，我该如何解决？
最佳答案
我在尝试加载预加载谷歌字体时不断收到警告。
事实证明，我错过了一个事实，即字体是作为一种样式从谷歌加载的。我通过设置 as="style' 然后使用 rel="stylesheet preload prefetch" 解决了这个问题。
参见下面的代码示例:
<link
as="style"
rel="stylesheet preload prefetch"
href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500&display=swap"
type="text/css"
crossorigin="anonymous" />
快乐编码 =)
关于html - 使用 rel preload 预加载字体，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/49674092/