在 AJAX 应用程序中重写 URL答案

【问题标题】：Rewriting URL in AJAX application在 AJAX 应用程序中重写 URL
【发布时间】：2012-10-21 22:58:05
【问题描述】：

我正在制作一个简单的在线申请。我有一个带有几个按钮和一个“div”的导航栏，所有新内容都将被动态加载到其中，即当我单击“关于”时，它会将页面部分加载到“div”中，而无需重新加载整个页面。加载（）函数。问题是：如果我需要提供指向我网站的文档部分的链接，或者用户想要存储这种链接，那么在浏览我的网站时不会重写 URL。当用户存储默认链接时，它将始终将他链接到默认的“主页”部分。

如何重写 URL，最正确的方法是什么？

【问题讨论】：

您可以在 url 中使用哈希来标识加载的部分并在获取页面时加载内容，即：sample.com#about。但我认为你错过了一个更大的问题，即你的内容不会被索引。 ajax 都很好，但我认为你在滥用它。
查看 history.js 或 jQuery BBQ 插件，它们会更改 url 中的哈希值并反向解析哈希值，以便您可以加载适当的内容。它们专为 ajax 友好的书签而设计
只有最近的浏览器支持history API。您可能想使用this wrapper

标签： javascript jquery url web

【解决方案1】：

作为选项，您可以使用location.hash。
例如。用户点击<a href="#about">About</a>
并且您正在加载“关于”页面的内容。浏览器地址栏中的 URL 也会更改为 http://mysite.com/hello.jsp#about。

所以现在用户可以复制这个 URL 并访问它。

然后在$(document).ready()中可以查看location.hash，在里面找到'#about'锚点，然后加载相应的内容。

另一种选择是使用Backbone.js 或您喜欢的任何其他 JavaScript MVC 框架，这将帮助您构建富客户端应用程序并为您处理此类事情。

【讨论】：

【解决方案2】：

据我所知，适当的方法是更新 URL 的哈希值。例如 example.com/#About 等。人们可以为这些添加书签。当您读取 URL 中的哈希标记并加载相应页面时，您必须小心进行 AJAX 调用。

我要做的是在 hashchange 事件上进行 ajax 调用，而不是单击。从 IE8 到所有现代浏览器都支持此事件。如果您想支持 IE7，请使用 Ben Alman 的 hashchange plugin。

【讨论】：