向前和向后浏览时,AJAX活动消失

时间:2014-11-16 04:45:48

标签: javascript ajax http dom browser

这不是Meta问题。

我试图在技术上理解隐藏在以下行为背后的原则。它很容易重现:

  1. 投票/ 向下此页面上的任何内容 1
  2. 点击此页面上的任何其他链接
  3. 按后退按钮返回。
  4. 您的upvote不再存在,以及页面上出现的任何AJAX活动。

    为什么?为什么浏览器会这样? StackOverflow怎么能防止这种情况?


    1 如果您没有连接,只需在移动页面之前等待页面上的其他人的活动(新评论,回答,投票)。

2 个答案:

答案 0 :(得分:2)

这是浏览器的缓存在这里发挥作用。

由于您被问及SO如何“防止”这种情况,可以通过建议浏览器检查文档是否每次都发生变化来完成。但出于性能原因,不这样做。因此,HTML文档在一段时间内被视为“仍然有效”,在此期间浏览器直接从其缓存中获取,而不是往返于服务器。

如果您在浏览器的开发者工具中查看浏览器针对此页面发出的请求的HTTP响应标头,您将看到类似的内容,

Cache-Control:  public, no-cache="Set-Cookie", max-age=60

- 所以这个HTML文档被认为有效60秒。如果您离开它并返回浏览器,或关闭选项卡并从历史记录中重新打开它,在60秒内,浏览器应该采用它的缓存版本并显示它,而无需再次检查服务器是否或没有什么变化。由于您的投票没有操纵这个原始HTML文档(只有DOM通过您的投票更新),您仍然可以显示之前的投票数。

但是,如果您在浏览器中按[F5],将会绕过缓存 - 它将再次从SO请求文档,然后您会看到您的投票,因为这次更新的数字是更新的HTML的一部分SO为您服务的文件。

如果你想深入研究HTTP缓存,谷歌顶级的一些资源似乎值得一看:

Caching Tutorial for Web Authors and Webmasters

A Beginner's Guide to HTTP Cache Headers

答案 1 :(得分:1)

你不是“没有投票”,你只是没有看到你的投票,因为你的浏览器正在缓存ajax请求。

如果您在Chrome上按F12,请点击“设置”图标,然后选择“禁用缓存(当DevTools处于打开状态时)”,当您按下浏览器时,将重新发送请求。

为了防止您必须在代码上指定您永远不希望缓存该特定请求。

您可能需要查看以下帖子:

Prevent browser caching of jQuery AJAX call result

-

聚苯乙烯。您必须在进行测试时保持打开控制台(F12)。