2

我正在学习 HTML5 历史 API。以下是我能够实现的。

我有一个页面“a.html”，其中包含所有内容和指向“b.html”的链接。当我点击链接时，我几乎所有的内容都保持不变，只是图像发生了变化。所以我要做的是编写一个点击处理程序并避免加载“b.html”[实际上我的服务器中不存在 b.html]。我创建了一个 XMLHTTPRequest 并仅获取需要替换的内容（放置在名为“xmlres.html”的文件中，仅包含一个 img 标签）并使用 pushstate() 更新 url。

一切正常。但问题是如果用户尝试复制当前 url “appname/b.html”并在另一个页面中打开，则找不到资源，因为我还没有创建“b.html”。我不想再次创建包含完整内容的 b.html，是否有任何解决方法可以解决此问题。

我应该为 URL 编写任何事件侦听器还是应该如何进行。对此的任何见解都会有很大帮助。

4

2 回答 2

2

我认为您在谈论单页应用程序，通常称为 SPA。

基本上这个概念的意思是你有一个index.html和里面你有一个默认隐藏的每个页面的部分，并通过javascript和面向休息的服务管理和处理基于用户交互的每个部分的内容。

单页应用程序通过使用标签进行导航而广为人知，在提供的小提琴中，这是使用井号完成的。

您可以通过此属性轻松访问哈希值：

console.log(window.location.hash);

这是我做的一个小提琴，页面转换功能齐全，给我一点历史API功能。

这是这个小提琴的作用：

  • 如果您访问基本 url，它将显示索引部分。
  • 如果您通过 url 访问基本 url，它将显示索引部分。
  • 如果您访问/1#sectionname该部分是否可用，它将显示它，否则它将显示您尝试访问的部分不可用，因此它将显示一条未找到的消息。
  • 通过 jQuery 支持历史 API。
  • 通过页脚链接导航。

在我添加历史记录功能时请耐心等待，如果您需要更多详细信息，请告诉我。

这是单页应用程序的维基百科页面，如果您想阅读更多内容。

编辑：

我还写了一篇关于它的博客文章

希望能帮助到你！

于 2013-05-18T21:15:51.807 回答
0

这是一篇描述您遇到的现象的文章（在文章的底部）： http ://www.sitepoint.com/an-overview-and-usage-of-javascript-history-api/

本质上，这归结为具有特殊的服务器能力，可以理解直接请求 404 URL 时要做什么。引用的文章显示了如何使用 PHP 完成此操作。其他应用程序服务器，如 Node、Vertx、Servlet Spec'd 服务器都为您提供对 URL 处理的特殊访问权限，让您可以确定是否会发生 404，并在发生 404 时为您提供特殊控制。这是一个未讨论的历史 API 的特殊情况。由于它，可能会出现一些其他问题。例如，当使用此技术时，在物理资源和 SPA 资源不存在时提供 404 可能仍然是一个好主意。虚拟资源是在 SPA 代码库中发生历史 API/URL 路由后将出现的页面。

于 2015-07-27T19:37:11.560 回答