带有部分页面更新功能的 HTMX hx-get 从原始页面重新加载资源

Answer 1

所以这似乎正在发生，因为 HTMX 深度克隆了 body 元素，作为在其自己的历史缓存中缓存页面的一部分（使用 LocalStorage）。它发生在这一行：https://github.com/bigskysoftware/htmx/blob/2d3fbbf09f7e6792132dafa2f22b0feb5e194d6b/src/htmx.js#L3154（

elt.cloneNode(true)

）。

深度克隆一个元素显然会重新请求其中的所有资源。至少这在 Firefox 的控制台及其网络选项卡中是可见的。我在Edge中没有找到这样的日志条目。所以也许这只是 Firefox 的一个 bug，我不知道。就我个人而言，我预计只有当节点实际插入到文档中时才会发生这种情况，而 HTMX 不会这样做。

好消息是，浏览器通常应该只是从缓存中获取它，而不是实际从服务器请求它。

为了防止此问题，您可以通过将属性

hx-history="false"

放置在页面上的某个位置来禁用 HTMX 的历史记录缓存。历史记录（即浏览器后退按钮）仍将照常工作，但它将完全由浏览器处理，没有任何

cloneNode(true)

或本地存储恶作剧。