javascript 防止浏览器缓存 AJAX 请求

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/11463637/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-26 13:19:12  来源:igfitidea点击:

Prevent browser from caching AJAX requests

javascriptajaxgoogle-chrome

提问by Mattisdada

I've setup an app and it works fantastic on Opera and Firefox, but on Google Chrome it caches the AJAX request and will give stale data!

我已经设置了一个应用程序,它在 Opera 和 Firefox 上运行良好,但在谷歌浏览器上它缓存了 AJAX 请求并会提供过时的数据!

http://gapps.qk.com.auis the app. When ran in Chrome it doesn't even send the AJAX requests, but when tried in another browser it always does the AJAX request and returns data.

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

Is there any method (Apache/PHP/HTML/JS) to stop Chrome from doing this behavior?

是否有任何方法(Apache/PHP/HTML/JS)可以阻止 Chrome 执行此行为?

The AJAX call:

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');

回答by gaurang171

The browser cache behaves differently on different settings. You should not depend on user settings or the user's browser. It's possible to make the browser ignore headers also.

浏览器缓存在不同设置下的行为不同。您不应依赖于用户设置或用户的浏览器。也可以让浏览器忽略标题。

There are two ways to prevent caching.

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

--> Change AJAX request to POST. Browsers don't cache POST requests.

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

--> Better Way & good way: add an additional parameter to your request with either the current time stamp or any other unique number.

--> 更好的方法和好方法:使用当前时间戳或任何其他唯一数字向您的请求添加附加参数。

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

回答by Mattisdada

Another alternative to the Javascript solution is to use custom headers: In PHP it would look like this:

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)
?>

回答by iknownothing

I was using jQuery ajax request when I ran into this problem.

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

According to jQuery APIadding "cache: false" adds a timestamp like explained in the accepted answer:

根据jQuery API添加“缓存:假”添加了一个时间戳,如已接受的答案中所述:

This only works with GET and HEAD requests though but if you're using POST the browser doesn't cache your ajax request anyways. There's a but for IE8, check it out in the link if needed.

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

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

回答by Puneet Mehra

Below line of code worked for me.

下面的代码行对我有用。

$.ajaxSetup({ cache: false });