Javascript Ajax消息传递系统问题

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

基本系统已完成（PHP/MySQL），以下是有关其结构的一些信息：

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

• URL=-右框：显示发送新消息的表单
• URL=-Ajax调用

  getUserMessages.php

  ，在登录用户和

  用户名

  并将其显示在右侧框中

---

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

---

现在，这个系统已经部分实现了Ajaxified，我希望它也能像Facebook一样

目前，Ajaxified部分是：

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

如果用户未查看对话，则会收到新消息并更新对话列表

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

我想改进这一点，让它像这样：

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

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

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

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

编辑

我想出了一个解决方案：

当用户打开对话时，我将整个Ajax响应（即HTML）缓存在一个变量中，如

messages-n

，其中

n

是所选对话的

用户id

，然后如果用户再次单击该对话，我检查是否设置了

messages-n

，如果设置了，我打印它并运行一个ajax请求，只获取未读消息并附加它们。 这只是在我的脑海里，我没有做到真正的代码

---

可以很好地工作吗？解决了1/2:

1。要更改地址URL，我正在使用HTML5

.pushState（）

事件

由于HTML5浏览器以不同的方式实现了

pushState

方法，因此为了获得跨浏览器解决方案，并支持HTML4浏览器的哈希回退，我使用了

2.要缓存邮件，我还没有找到解决方案，目前也没有尝试过。 但正如@Christopher所建议的，我将Ajax响应从HTML更改为Json。

---

如果我找到了，我会更新我的答案。

也许你可以将消息保存在一个数组中。当用户切换到已加载的对话时，这些消息将直接显示给他。您可以使用消息的ID（或其时间戳）从数据库中仅获取未读消息。@Christopher我用类似的解决方案编辑了我的问题，请查看。我认为这应该可以。只有一件事：我不会用html来回答ajax调用。为什么不使用xml或json并在客户端创建html呢？这将使您能够对不同的显示类型使用相同的脚本（例如，对话预览，或在更大的屏幕上，等等）。请将两个问题的解决方案作为答案发布，这样您的问题可以标记为已解决，具有相同问题的其他人将能够从中学习