javascript - 监控 location.hash 是 XHR 应用中历史的解决方案吗？

Question

众所周知，在 XHR(又名 AJAX)Web 应用程序中，没有构建应用程序的历史记录，并且单击刷新按钮通常会使用户退出他/她当前的事件。我偶然发现了 location.hash (例如 http://anywhere/index.html#somehashvalue )来规避刷新问题(使用 location.hash 通知您的应用程序它的当前状态并使用页面加载处理程序来重置该状态)。这真的很简单。

这让我开始考虑使用 location.hash 来跟踪我的应用程序的历史记录。我不想使用现有的库，因为它们使用 iframe 等。所以这是我的五分钱:当应用程序页面加载时，我开始:

setInterval(
       function(){
           if (location.hash !== appCache.currentHash) {
               appCache.currentHash = location.hash;
               appCache.history.push(location.hash);
               /* ... [load state using the hash value] ... */
               return true;
           }
           return false;
       }, 250
 );

(appCache 是一个包含应用程序变量的预定义对象)这个想法是从哈希值触发应用程序中的每个 Action 。在体面的浏览器中，哈希值更改会在历史记录中添加一个条目，而在 IE (<= 7) 中则不会。在所有浏览器中，向后或向前导航到具有另一个哈希值的页面不会触发页面刷新。这就是间隔函数接管的地方。每次检测到哈希值更改时(以编程方式，或通过单击后退或前进)，应用程序都可以使用该功能采取适当的措施。该应用程序可以跟踪它自己的历史记录，我应该能够在应用程序中显示历史记录按钮(尤其是对于 IE 用户)。

据我所知，这可以跨浏览器工作，并且在内存或处理器资源方面没有成本。所以我的问题是:这是否是管理 XHR 应用程序历史的可行解决方案？优缺点都有什么？

更新:因为我使用我的自制框架，我不想使用现有的框架之一。为了能够在 IE 中使用 location.hash 并将其保存在历史记录中，我创建了一个简单的脚本(是的，它需要一个 iframe)，它可能对您有用。我发表了 on my site ，请随意使用/修改/批评它。

Answer 1

大多数解决方案往往会解决三个问题:

返回按钮

书签

刷新按钮

window.location.hash在大多数情况下，基于解决方案的解决方案可以解决所有三个问题:hash 中的值映射到应用程序/网页的状态，因此用户可以按“后退”/“前进”/“刷新”之一并跳转到哈希中的当前状态。他们还可以添加书签，因为地址栏中的值已更改。 (请注意，与不影响浏览器历史的哈希相关的 IE 需要隐藏 iframe)。

但是我只想指出，可以使用仅 iframe 的解决方案而无需监视 window.location.hash也是一个非常有效的解决方案。

谷歌地图就是一个很好的例子。为每个用户操作捕获的状态太大而无法放入 window.location.hash( map 质心、搜索结果、卫星与 map View 、信息窗口等)。所以他们将状态保存到一个嵌入隐藏的表单中 iframe .顺便说一句，这也解决了[软]“刷新”问题。他们通过“链接到此页面”按钮单独解决书签问题。

我只是认为值得了解/分离您正在考虑的问题域。