Angular会再次加载预加载的svg

Question

我只是想在我的角度应用程序（index.html）中预加载svg精灵：

<link rel="preload" href="assets/img/logos/app_white_full.svg" as="image">
<link rel="preload" href="assets/icons/font/symbol-defs.svg" as="image" crossorigin>

文件“ app_white_full.svg”正在加载一次，太好了！ 但是另一个是svg精灵的“ symbol-defs.svb”正在由Angular重新加载（第3行和第8行）：

这些调用之间的唯一区别是请求标头。

来自index.html的

“ symbol-defs.svg”具有：

Sec-Fetch-Mode: cors

Angular组件中的“ symbol-defs.svg”具有：

Sec-Fetch-Mode: same-origin

这不是问题所在。为什么其他文件没问题？

此外，我在控制台日志上收到了此消息：

资源http：// localhost：8080 / assets / icons / font / symbol-defs.svg已使用链接预加载进行了预加载，但在窗口加载事件发生后的几秒钟内未使用。请确保它具有适当的as值，并且是有意预载的。

为什么它不能被识别为相同的？