javascript - Ajax 消息系统问题

Question

我正在开发像 Facebook 这样的消息传递系统。我确实在左侧有一个对话列表，在右侧有一个我加载消息的框，就像 facebook 一样。

基本系统是完整的（PHP/MySQL），这里有一些关于它的结构的信息：

• messages.php - 主页，基于 url 参数。用.htaccess重写：

  例子：

  1. URL = http://www.domain.com/messages/ - 右框：显示表单以发送新消息。
  2. URL = http://www.domain.com/messages/Username - Ajax 调用以getUserMessages.php加载登录用户之间的消息并 Username在右侧框中显示它们。

---

• getUserMessages.php - 从登录用户和选定用户之间的数据库消息中获取。它会输出准备显示的 HTML。

---

现在系统是部分 Ajaxified，我希望它是，就像 Facebook 一样。

目前 Ajaxified 部分是：

当用户查看对话时，它会自动显示新消息，并使用最后一条消息更新对话列表。

如果用户没有查看对话，它会收到新消息并更新对话列表。

这是通过 PUSH 服务完成的，为用户提供实时体验。

我想改进这一点，并使其表现得像这样：

用户点击对话列表，它会在右侧的 Box 中加载消息，并更改地址栏上的 URL，而无需重新加载整个页面。

当用户单击对话时，我可以轻松地加载消息，但在我开始之前我有两个问题：

1.如何在显示用户对话时更改地址 URL 而无需重新加载页面？
我找到了答案。

2.我如何缓存对话？因此，如果用户在两个对话之间切换，它不会再次调用 php 文件并查询数据库中的所有消息，而是仅附加新消息（可能通过另一个 php 文件仅获取未读消息）

编辑

我想出了一个解决方案：

当用户打开对话时，我将整个 Ajax 响应（即 HTML）缓存在一个变量中，例如，选择的对话messages-n在哪里，然后如果用户再次单击该对话，我检查是否已设置，如果它是，我打印它并运行 ajax 请求以仅获取未读消息并附加它们。那只是在我的脑海里，我没有把它变成实际的代码。nuser_idmessages-n

能不能好好工作？

Answer 1

Solved 1/2 :

1. To change Address URL i'm using the HTML5 .pushState() event.

Since HTML5 Browsers implement the pushState method in different way, to have a Cross-Browser solution, and have support for HTML4 browsers with hash Fallback, i used Hystory.js.

2. To cache messages, i haven't found a solution yet, nor i tried to do it for now. But as @Christopher suggested, i changed the Ajax response from HTML to Json. If i find it i will update my answer.