修改AJAX应用程序中的地址栏URL以匹配当前状态
我正在编写一个AJAX应用程序，但随着用户在应用程序中移动，我希望尽pipe没有页面重新加载，地址栏中的URL也会更新。 基本上，我希望他们能够在任何时候join书签，从而回到当前状态。
人们如何处理在AJAX应用程序中保持RESTfulness？
做到这一点的方法是，当AJAX更新导致状态变化，你想有一个谨慎的URL操作location.hash 。 例如，如果您的网页的url是：
如果一个客户端函数执行了这个代码：
// AJAX code to display the "foo" state goes here. location.hash = 'foo';
然后，浏览器中显示的URL将被更新为：
这允许用户为页面的“富”状态添加书签，并使用浏览器历史logging在状态之间导航。
有了这个机制，你就需要使用JavaScriptparsing出客户端URL的散列部分，以创build并显示适当的初始状态，因为片段标识符（＃之后的部分）不会被发送到服务器。
本Alman的hashchange插件使后者轻而易举，如果你使用jQuery。
看看像book.cakephp.org这样的网站。 这个网站在不使用散列的情况下更改URL并使用AJAX。 我不知道它是如何做到这一点，但我一直在试图弄清楚。 如果有人知道，让我知道。
另外github.com在某个项目中查看导航。
在使用Ajax时，作者不太可能重新加载或redirect访问者。 但为什么不使用HTML5的pushState / replaceState ？
您可以尽可能多地修改地址栏。 通过AJAX获得自然的外观。
查看我最新项目的代码： http : //iesus.se/
这与凯文所说的相似。 您可以让您的客户端状态为一些javascript对象，并且当您想要保存状态时，可以序列化对象（使用JSON和base64编码）。 然后，您可以将href的片段设置为该string。
var encodedState = base64(json(state)); var newLocation = oldLocationWithoutFragment + "#" + encodedState; document.location = newLocation; // adds new entry in browser history document.location.replace(newLocation); // replaces current entry in browser history
第一种方法将新状态视为一个新的位置（所以后退button将把他们带到以前的位置）。 后者不。
SWFAddress在Flash和Javascript项目中工作，并允许您创build可collections的URL（使用上面提到的散列方法），并为您提供后退button支持。
window.location.hash方法是做事的首选方式。 有关如何执行此操作的解释，请参阅Ajax模式 – 唯一的URL 。
YUI把这个模式作为一个模块来实现，它包括了IE的特定工作，以获得后退button以及使用哈希重写地址。 YUI浏览器历史loggingpipe理器
其他框架也有类似的实现。 重要的一点是如果你想让历史与重写地址一起工作，不同的浏览器需要不同的处理方式。 （这在第一个链接文章详细。）
IE需要基于iframe的黑客攻击，其中Firefox将使用相同的方法产生双重历史logging。
如果OP或其他人仍然在寻找修改浏览器历史来启用状态的方法，那么按照IESUS的build议，使用pushState和replaceState是现在这样做的“正确”方法。 相对于位置来说，这是主要的优势。哈希似乎是创build实际的URL，而不仅仅是哈希。 如果使用哈希的浏览器历史logging被保存，然后重新访问javascript禁用，应用程序将无法正常工作，因为散列不会发送到服务器。 但是，如果pushState已被使用，则整个路由将被发送到服务器，然后您可以构build这个服务器来适当地响应路由。 我看到一个例子，在服务器和客户端都使用相同的胡须模板。 如果客户端启用了JavaScript，他将通过避免往返于服务器而获得快速的响应，但是如果没有javascript，应用程序将完好无损。 因此，在没有javascript的情况下，应用程序可以优雅地降级。
另外，我相信有一些框架，像history.js这样的名字。 对于支持HTML5的浏览器，它使用pushState，但是如果浏览器不支持，它会自动回退到使用散列。
检查用户是否在页面中，当你点击url栏时，javascript表示你不在页面上。 如果你改变url栏，并按下'ENTER'button，那么你再次进入页面，不用鼠标手动点击页面，然后从JavaScript的keyboad事件命令（document.onkeypress）将能够检查它是否进入并激活redirect的JavaScript。 你可以检查用户是否在window.onfocus页面，并检查他是否与window.onblur。
是的，这是可能的。
;）
