防止浏览器缓存 AJAX 请求答案

【问题标题】：Prevent browser from caching AJAX requests防止浏览器缓存 AJAX 请求
【发布时间】：2020-03-16 14:52:30
【问题描述】：

我已经设置了一个应用程序，它在 Opera 和 Firefox 上运行良好，但在 Google Chrome 上它会缓存 AJAX 请求并提供过时的数据！

http://gapps.qk.com.au 是应用程序。在 Chrome 中运行时，它甚至不发送 AJAX 请求，但在另一个浏览器中尝试时，它总是发出 AJAX 请求并返回数据。

是否有任何方法（Apache/PHP/HTML/JS）来阻止 Chrome 执行此行为？

AJAX 调用：

function sendAjax(action,domain,idelement) {

                    //Create the variables
                var xmlhttp,
                    tmp,
                    params = "action=" + action
                             + "&domain=" + encodeURIComponent(domain)

                    xmlhttp = new XMLHttpRequest(); 
                //Check to see if AJAX request has been sent
                xmlhttp.onreadystatechange = function () {
                    if (xmlhttp.readyState === 4 && xmlhttp.status === 200) {
                        $('#'+idelement).html(xmlhttp.responseText);
                    }
                };
                xmlhttp.open("GET", "ajax.php?"+params, true);
                xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
                //console.log(params);
                xmlhttp.send(params);

            }
sendAjax('gapps','example.com','gapps');

【问题讨论】：

PHP 脚本返回的标头是什么？确保它们不允许缓存，并返回适当的内容类型。

标签： javascript ajax google-chrome

【解决方案1】：

浏览器缓存在不同的设置下表现不同。您不应依赖用户设置或用户的浏览器。也可以使浏览器忽略标题。

有两种方法可以防止缓存。

--> 将 AJAX 请求更改为 POST。浏览器不缓存 POST 请求。

--> Better Way & good way：为您的请求添加一个附加参数，带有当前时间戳或任何其他唯一编号。

params = "action=" + action 
         + "&domain=" + encodeURIComponent(domain) 
         + "&preventCache="+new Date();

【讨论】：

我认为这是一个解决方案，但我认为它不优雅，好的，谢谢！ :)
仅供参考，让您安心。当您说 preventCache 到 ajax 调用时，主要框架都会使用此解决方案，其中一个示例是 DOJO。添加一些数字而不是日期
真的吗？这对我来说似乎是一种“hacky”方法，它很有效（很棒），但我原以为会有更好的方法将他们作为“官方”的方式来做。再次感谢！ :)
这是一个老问题，但它仍然出现在我的 Google 搜索查询的前 3 个结果中。发送自定义服务器标头（来自@Mattisdada 的回复）是处理不应该被缓存的文件的最佳方式。对于偶尔需要刷新的静态文件，发送一个带有您要加载的文件版本的参数（例如params += '&preventCache=1.0.1'），而不是当前时间戳。缓存仍然有效，更改版本字符串将刷新文件。

【解决方案2】：

Javascript 解决方案的另一种替代方法是使用自定义标头：在 PHP 中它看起来像这样：

<?php
   header("Cache-Control: no-store, no-cache, must-revalidate, post-check=0, pre-check=0");//Dont cache
   header("Pragma: no-cache");//Dont cache
   header("Expires: Thu, 19 Nov 1981 08:52:00 GMT");//Make sure it expired in the past (this can be overkill)
?>

【讨论】：

这适用于所有浏览器吗？如果是这样，这比查询参数 hack 更优雅很多...

【解决方案3】：

当我遇到这个问题时，我正在使用 jQuery ajax 请求。

根据jQuery API 添加“cache: false”会添加一个时间戳，如已接受答案中所述：

这仅适用于 GET 和 HEAD 请求，但如果您使用 POST，浏览器无论如何都不会缓存您的 ajax 请求。 IE8 有一个但是，如果需要，请在链接中查看。

$.ajax({ 
type: "GET",
cache: false, 
});

【讨论】：

【解决方案4】：

下面这行代码对我有用。

$.ajaxSetup({ cache: false });

【讨论】：