jquery - 你能清除jquery ajax缓存吗?

标签 jquery

我想知道是否可以通过特定的 AJAX 方法清除缓存。

假设我有这个:

$.ajax({
  url: "test.html",
  cache: true,
  success: function(html){
    $("#results").append(html);
  }
});

现在 99% 的情况下,可以使用缓存结果,因为它应该始终具有相同的内容。但是,如果用户更新此内容,它(当然)会发生变化。如果被缓存,它仍然会显示旧内容。

所以,如果我能为这个方法选择这个缓存并清除它,并且所有其他缓存的东西都会保留,那就太酷了。

这可以做到吗?

编辑

我不跟随。我发现如果您将 cache 设置为 false,它会生成一个唯一的 URL 以防止浏览器缓存它。

我的问题是我希望它被缓存,直到有人对其进行更新。那么它不应该被缓存,直到他们再次点击它。然后应该再次缓存它。

基本上,我有一个更新模型对话框(jquery UI),它会弹出一个更新表单,以便用户可以更新表行。当他们单击“更新”时,它会更新该表行。现在,一列可以包含几个段落的数据,这会使表格看起来很糟糕。

因此,为了保留该表,我在其中放置了一个名为“显示数据”的链接。现在,当单击此按钮时,会显示一个对话框模型框,并从服务器中提取数据。

如果他们点击它 5 次,它就会重新加载 5 次。这就是为什么我想缓存它。但是,如果他们单击它并且它被缓存,那么无论出于何种原因,他们都会更新该行并单击“显示数据”,他们将获得缓存的版本,而不是更新的版本。

我可能可以隐藏所有段落并使用 jquery 显示它们,但我宁愿按需显示。否则就会隐藏太多垃圾,并且会减慢页面速度(想象一下,如果某个人有 50 行,每一列都有大约 1000 个字符)。

最佳答案

您误解了 $.ajax 的默认 cache: true 参数。在文档中,您将找到以下内容:

If set to false it will force the pages that you request to not be cached by the browser.

要了解此参数的真正作用,您应该查看 jQuery 源代码:

if ( s.cache === false && type === "GET" ) {
    var ts = now();

    // try replacing _= if it is there
    var ret = s.url.replace(rts, "$1_=" + ts + "$2");

    // if nothing was replaced, add timestamp to the end
    s.url = ret + ((ret === s.url) ?
            (rquery.test(s.url) ? "&" : "?") + "_=" + ts : "");
}

因此,如果您使用 cache: false,jQuery 只会向 URL 中添加一个带有当前时间的附加参数。然后,浏览器会看到另一个 URL,并确定其缓存中没有该 URL 的数据,因此会将请求转发到服务器。仅此而已。

更新基于问题的编辑部分:如果我理解正确的话,您想使用本地浏览器缓存,但您想控制它。如果是这样,您应该使用默认值 cache: true (不要在 $.ajax 中添加此参数)。您应该向服务器响应添加一些额外的缓存信息,而不是依赖 $.ajax() 选项。浏览器将始终明确遵循写入相应页面标题中的缓存指令。

例如,您可以在响应 header 中添加一个时间,指定页面的有效时间。如果您不需要客户端上数据的绝对最新版本,那么它非常有效(请参阅 http://www.w3.org/Protocols/rfc2616/rfc2616-sec13.html )。

我在大多数应用程序中使用的另一种方法是将以下内容添加到服务器响应 header

  1. “Cache-Control”设置为“max-age=0”,这会关闭本地缓存
  2. “Etag”带有一些值(例如,发送的数据的 MD5 哈希值)来标识数据包含的内容。该值是完全免费的,您可以按照自己喜欢的方式计算它,但是两个不同的响应应该具有不同的“Etag”值。

如果您希望始终拥有最新版本的数据,但不希望服务器发送数据,则此方法非常适合动态内容(例如,基于数据库数据的响应)如果自上次响应以来没有改变,请再次进行。如果您遵循此方法,浏览器(每个浏览器)将在第二次单击“显示数据”按钮时将“Etag”值添加到发送到服务器的数据的 header 中 “如果-None-Match" HTTP 请求 header 。然后服务器可以定义数据是否改变。如果没有,服务器可以使用响应和“304 Not Modified”而不是“200 OK”进行响应。浏览器知道这一点,它直接从本地现金获取数据。因此您的 $.ajax 请求将成功结束,您将获得本地现金的数据。

您当然可以结合两种方式。只需设置一些非零值来代替“max-age=0”,该值是本地现金的有效期(以秒为单位)(请参阅 http://www.w3.org/Protocols/rfc2616/rfc2616-sec14.html#sec14.9.3 )

关于jquery - 你能清除jquery ajax缓存吗?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/2960810/

相关文章:

JQuery:合并多个 JSON 结果

javascript - Android 4.4 WebView中的jquery问题

jquery:如何更新可拖动克隆ID?

jquery - 遍历 Div 并检查是否使用 jquery 检查子元素

javascript - Jquery 禁用 mousedown 事件而不丢失与事件关联的函数

php - WordPress 按自定义字段排序,按自定义字段对列表进行排序

javascript - 通过匹配表中的关联为行着色

jquery - 嵌套的 SAME 元素。当 :hover child, 禁用时:悬停父 CSS

javascript - 无法将日期选择器应用于使用 .load 添加到应用程序的 html 页面上的字段

javascript - JQuery Toggle 在第一次点击时有效,但不会再次点击(如预期的那样)