特性检测BFCache？

Question

当使用后退按钮回到一个DOM已经被修改的页面时，我在IE10中遇到了这个问题，这让我很惊讶：

我希望看到的行为是1或2，但不是3：

1. 完全恢复所有状态（像FF和Chrome一样）
2. 重新加载页面（因为它不应该被缓存），并且当前状态可以通过ajax将更改推送到服务器来重新创建（IE8就是这样做的）
3. 但是IE10返回到初始未修改的页面（它保留表单输入，如果初始页面上有输入，但不是整个状态）

因为我赶时间，所以当有人在对DOM进行修改后访问页面时，我只采用了强制重新加载的方法（这个信息存储在哈希中），这是一个相当愚蠢的解决方案（FF和Chrome不需要重新加载，但现在需要）。

有一种建议是使用localStorage来记住状态，我猜这种功能也被包含在history.js中。

为了进行比较/以防状态没有恢复，保留一个备用副本似乎有些过度，特别是因为在我们的情况下，这是可能影响到0.01%的用户的问题。 对于我的目的，如果状态没有完全保存在bfcache中，强制重新加载会足够。

我能否“简单地”检测是否存在包含所有状态的bfcache？如果可以，那么当有人返回到修改DOM的页面时，在其不存在时我可以强制重新加载吗？

- Ruben

---

看起来这里似乎相关：https://dev59.com/D0vSa4cB1Zd3GeqPdVLy - Ryan

@ryan 谢谢，我知道那个问题。它是相关的，但答案是关于从各种本地存储恢复状态，而不是检测“好坏”的bfcache。 - Ruben

Answer 1

如果浏览器用户代理或浏览器已知无法保存修改后的状态，则可以刷新页面。

您还可以在修改状态后将“#modified”附加到URL中，因此如果URL包含“#modified”，但状态仍为默认值，则应该刷新页面，因为状态未正确缓存。

if(document.location.hash == "#HelloWorld")
{
    // Check if state is default
    // If state is default, the page should be refreshed
}
document.location.hash = "#HelloWorld";

- Koen

---

所以基本上您建议我在DOM中设置某种标志，以便我可以区分默认状态和非默认状态？否则，我将最终存储所有状态更改两次，以找出是否有任何编辑。问题是，现在没有默认/非默认状态，任何状态都可以是从服务器加载的内容和用户输入后出现的内容。在这种情况下，设置这样的标志的好方法是什么？ - Ruben

当用户更改状态时设置标志？也就是在某个地方更改输入。 - Koen

对不起，这个问题有点旧了。我想我当时尝试过一些类似的东西，但失败了。将状态标志存储在隐藏输入中肯定无法区分IE10的差劲bfcache和FF和Chrome的（因为IE10会存储输入）。但这是一种比较弱的回应，不幸的是我没有时间或需要去解决我的旧问题。 - Ruben