发送XMLHttpRequest时缓存结果的问题?

时间:2013-10-30 23:37:35

标签: javascript php ajax caching

我对AJAX以及缓存的想法不熟悉。

在W3Schools的AJAX - Send a Request To a Server上,它说您应该在要运行的脚本的URL末尾添加"?t=" + Math.random()以防止缓存。

在维基百科上,“缓存”的简单定义是:

  

在计算机科学中,缓存是透明地存储数据的组件,以便可以更快地提供对该数据的未来请求。存储在缓存中的数据可能是先前已计算的值,也可能是存储在其他位置的原始值的副本。

但是,这不应该更好吗?如果计算机已经存储了一些重复数据,脚本将运行得更快。此外,教程页面上的第一个示例,没有添加到URL,工作正常。

有人可以告诉我使用"?t=" + Math.random()背后的原因吗?

3 个答案:

答案 0 :(得分:7)

  

但是,这不应该更好吗?

是的,为了性能原因,最好有一个缓存系统,你的应用程序页面会快速加载,因为一次加载的元素将被检索,而不会每次都向服务器发出HTTP请求。

  

有人可以告诉我使用“?t =”+ Math.random()背后的原因吗?

添加此"?t=" + Math.random()就像每次重新加载脚本时重命名脚本的URL一样。缓存系统将其视为一个新元素,而不是像已经存储的旧元素,即使没有真正改变的东西。所以它迫使从服务器重新加载元素。

通常,我们可能希望对经常更新的元素(如图像,脚本)执行此操作。例如,用户可以更改的网站中的个人资料图片就是这种情况,如果旧图片文件在缓存中,如果我们不使用随机数的那个技巧,用户将不会立即看到新图片。 。用户可能认为他的上传不起作用。他必须在浏览器中手动清空缓存,这并不总是非常直观。

第二个原因可能是我们在开发过程中这样做很好,因为我们不需要每隔几分钟清空一次我们的代码更改的缓存......

但是,不要在你确定不会改变或很少改变的元素上使用这个技巧。

答案 1 :(得分:1)

在这样的Web服务请求的末尾添加一些随机元素的原因是因为在许多情况下,您希望数据始终是新鲜的。如果你正在缓存它,那么数据可能不会很新鲜。

例如,假设您有一个AJAX请求,可以获得当前游戏的高分。你用http://example.com/get_high_score.php来称呼它。假设它返回100。现在,假设你等了5秒再次调用它(或者用户刷新他们的页面)。如果该请求已缓存,则可能会再次返回100。但是,在那个时候,分数实际上现在可能是125

如果您拨打http://example.com/get_high_score.php?t=12345786,则分数将是最新值,因为它未被缓存。

url + "?t=" + Math.random()只是这样做的一种方式。我实际上更喜欢使用时间戳,因为它保证始终是唯一的。

url + "?t=" + (new Date()).getTime()

另一方面,如果你不需要数据总是新鲜的(例如,你只是发送一个几乎从不改变的菜单项选项列表),那么缓存是可以的,你想要离开额外的一点。

答案 2 :(得分:0)

另一种方法是使用时间戳,或设计一个每隔几秒钟更改一次的时间戳。虽然最好的方法(如果可以的话)是在服务器响应的标题中添加条目,告诉浏览器不要缓存结果。

var t = new Date().getTime(); var t2 = Math.floor(t/10000); url = target_url + "?t=" + t2;

虽然在这种情况下不太可能,但请注意,如果您的网站不断生成随机内部网址的链接(例如通过服务器端代码),那么它就会成为“蜘蛛陷阱”,搜索引擎等抓取工具会陷入循环之后随机链接导致服务器负载达到峰值。