首页 > 解决方案 > 如何在angular8 SSR上添加带有哈希文件的动态链接标签预取

问题描述

我使用 Angular 8 作为 SSR 或 Angular Universal,我们发现在主 Angular 文件中添加动态预取链接标签非常困难。

在构建为 ssr 之后,代码在 index.html 的末尾注入这样的一行,

<script src="runtime.58b180e8c30580ec9ea9.js" defer></script><script src="polyfills-es5.ea80a4cb53fa86a5c510.js" nomodule defer></script><script src="polyfills.c8c0431bcdc0afdb2644.js" defer></script><script src="scripts.2bbb0f7e81eb835e1cea.js" defer></script><script src="vendor.e7551457890efc085d4b.js" defer></script><script src="main.80bdfc18f9240a3efe5c.js" defer></script></body>

</html>

但是,在 head 标签上,我们需要有这样的东西

  <link rel="prefetch" as="script" href="/runtime.js">
  <link rel="prefetch" as="script" href="/polyfills-es5.js">
  <link rel="prefetch" as="script" href="/polyfills.js">
  <link rel="prefetch" as="script" href="/scripts.js">
  <link rel="prefetch" as="script" href="/vendor.js">

问题是每个构建都会有不同的哈希,所以我们需要一个选项来在渲染页面之前检测服务器上的哈希。

任何想法,我们怎么能做到这一点?

Angular 8 作为 SSR,带有 express.js

标签: angulartypescriptexpressserver-side

解决方案


推荐阅读