IE 浏览器缓存和 jQuery 表单插件

Posted 2023-05-09

【中文标题】IE 浏览器缓存和 jQuery 表单插件

【英文标题】：IE browser caching and the jQuery Form Plugin

【发布时间】：2011-01-19 19:03:24

【问题描述】：

像我之前许多迷失的灵魂一样，我在 Ajax 表单提交和 IE 浏览器缓存的蛇坑中挣扎。

我正在尝试使用 jQuery 表单插件编写一个简单的脚本来 Ajaxify Wordpress cmets。它在 Firefox、Chrome、Safari 等中运行良好。 al.，但在 IE 中，响应文本被缓存，结果是 Ajax 拉入了错误的注释。

    jQuery(this).ajaxSubmit(
        success: 
            function(data) 
                var response = $("<ol>"+data+"</ol>");
                response.find('.commentlist li:last').hide().appendTo(jQuery('.commentlist')).slideDown('slow');
                       
        );

ajaxSubmit 将评论发送到 wp-cmets-post.php，它不雅地吐出整个页面作为响应。因此，尽管它像蟾蜍一样丑陋，但我还是将响应文本粘贴在一个变量中，使用 :last 来隔离最近的评论，并将其向下滑动。

但是，IE 正在返回页面的缓存版本，其中不包含新评论。所以“.commentlist li:last”选择了previous评论，它的副本然后毫无用处地滑到原来的下面。

我尝试在 ajaxSubmit 选项中设置“cache: false”，但没有效果。我已经尝试设置一个 url 选项并添加一个随机数或时间戳，但它最终被附加到将评论提交给服务器的 POST，而不是返回响应的 GET，因此没有任何效果。我不确定还能尝试什么。如果我关闭浏览器缓存，在 IE 中一切正常，但这显然不是我可以期望任何查看页面的人做的事情。

我们将不胜感激任何帮助。提前致谢！

使用进度报告编辑：一些人建议使用 PHP 标头来防止缓存，这确实有效。问题是 wp-cmets-post 在提交新评论时会吐出整个页面，而我可以看到添加标题的唯一方法是将它们放在 Wordpress 帖子模板中，这会完全禁用所有帖子的缓存次——不完全是我正在寻找的行为。

有没有办法设置 php 条件——“if is_ajax”或类似的东西——这样可以防止在常规页面加载期间应用标题，但如果页面由 Ajax GET 调用，则将它们插入？

【参考方案1】：

jQuery.ajaxSubmit() 采用标准 jQuery.ajax() 的任何选项。因此，您可以使用标准 cache: false 选项来关闭缓存：

jQuery(this).ajaxSubmit(
    cache: false,
    success: 
        function(data) 
            var response = $("<ol>"+data+"</ol>");
            response.find('.commentlist li:last').hide().appendTo(jQuery('.commentlist')).slideDown('slow');
                   
    );

【参考方案2】：

我一直这样做的方法是在末尾添加一个 rand=new Date().getTime()

if(url.replace("?") != url)
   url = url+"&rand="+new Date().getTime();
else
   url = url+"?rand="+new Date().getTime();

上面的函数会将rand=time附加到url的地址[地址到.php]如果你提供了get参数，它将添加&rand=time...否则它将添加?rand=time 浏览器不断缓存，但页面不会重叠。

您也可以使用 PHP 的 header() 通过设置 Cache-control: 和 Expires: 来禁用缓存

【讨论】：

问题在于，我在 ajaxSubmit 中添加到 url 选项的任何内容似乎仅适用于将评论发送到服务器的初始 POST，但不适用于返回响应的 GET。所以我看到一个 POST 到“wp-cmets-post.php&rand=[一堆数字]”，然后是一个 GET，它只是没有 rand 字符串的页面的 url。这就是 IE 获取错误数据的地方。知道如何将字符串添加到该 GET 中吗？我根本不知道如何与之交互。

跟进：刚刚尝试使用 PHP header() 将缓存控制设置为无缓存，它就像一个魅力。所以这就是进步！问题是它会阻止所有 Wordpress 帖子在所有情况下的缓存，这不是我想要的。不过，这仍然是朝着正确方向迈出的一步。

你应该只为你不想缓存的 .php 文件添加标题。否则，您应该向浏览器发送“是的，为我缓存”标题

见上面的编辑。由于 wp-cmets-post 返回整个页面，我不确定如何应用标题而不将它们粘贴在 Wordpress 帖子模板中。

【参考方案3】：

把这个放在你的 php 的开头：

header("Cache-Control: no-cache, must-revalidate");
header("Expires: Sat, 26 Jul 1997 05:00:00 GMT");

这应该会有所帮助。如果没有 - 尝试将随机数作为带有标题的文件名。

帖子被重定向到获取请求，您必须向获取页面发送一些信息来控制是否应该缓存它。

【讨论】：

标头功能效果很好，但 wp-cmets-post 正在返回整个页面。因此，在我的 php 开头添加缓存清除标头意味着将其添加到 Wordpress 帖子模板中，这会杀死所有帖子的缓存——显然不是一个好的举措。有没有办法针对“仅当页面由 wp-cmets-post 返回”条件？

我不知道 wordpress，但是您应该尝试在输出标头时查看可用的 HTTP 信息。如果调用是在 AJAX POST 调用之后进行的，而不是由客户端浏览器触发，则它应该是可追踪的。

【参考方案4】：

这将阻止全局缓存

$(document).ready(function() 
     $.ajaxSetup( cache: false );
);