HTML 预加载链接无法加载 fetch答案

【问题标题】：HTML preload link not not working to load fetchHTML 预加载链接无法加载 fetch
【发布时间】：2020-07-25 13:01:42
【问题描述】：

我正在使用链接标签预加载一个 html 页面

<link rel="preload" href="/pages/test" as="fetch">

然后稍后使用fetch 获取它

async function loadPage() {
  const html = await (await fetch("/pages/test")).text();
}
loadPage();

但仍在发出两个单独的请求。我已经尝试了here 的解决方案，但没有一个对我有用。

【问题讨论】：

获取请求已发送，但在到达服务器并从浏览器缓存提供响应之前被浏览器拦截。这将显示为两个网络调用，但您的服务器应该只看到一个请求。
@DanPantry 我正在使用 chrome（并且我测试了预加载图像，它确实有效），因此支持预加载。我在服务器上放置了一个 console.log（我使用的是 node.js），它记录了每个请求的 url，并且“127.0.0.1:8080/pages/test”被记录了两次

【解决方案1】：

rel="preload" 只应用于获取 JSON 或 ArrayBuffer 响应，不应用于下载 HTML 页面。还包括crossorigin 属性以避免重复请求。

【讨论】：