预载字体加快网站速度，不要下载两次？

Question

我想从这里的这个文件中预加载我正在使用的两种字体。https:/res.cloudinary.comprodigy-official-derawuploadv1581064331www.prodigy-official.de%20resourcesfontsfont.style.css。

所以我尝试的是这里的这段代码。

<link rel="preload" href="https://res.cloudinary.com/prodigy-official-de/raw/upload/v1578333925/www.prodigy-official.de%20resources/fonts/XRXV3I6Li01BKofINeaB.woff2" as="font">
<link rel="preload" href="https://res.cloudinary.com/prodigy-official-de/raw/upload/v1999999/www.prodigy-official.de%20resources/fonts/icomoon.woff2?10si43" as="font">

他在链接中预装了两种字体 然后又在font.style. 所以它不工作。结果就在这里。

我怎样才能把两个字体都下载一次，然后在font -face的url中使用这个预取缓存？

Answer 1

尝试添加到链接

type="font/woff2" crossorigin

比如说

<link rel="preload" href="https://res.cloudinary.com/prodigy-official-de/raw/upload/v1578333925/www.prodigy-official.de%20resources/fonts/XRXV3I6Li01BKofINeaB.woff2" as="font" type="font/woff2" crossorigin>

对我来说，它的工作和字体文件被下载只有一次，我想它需要它，以确保这些是完全相同的文件......