意外的AJAXcaching结果在IE8中
从Internet ExplorercachingJQuery Ajax请求的结果,我遇到了严重问题。
每当用户导航到新页面时,我的网页上都会显示标题。 一旦页面被加载,我这样做
$.get("/game/getpuzzleinfo", null, function(data, status) { var content = "<h1>Wikipedia Maze</h1>"; content += "<p class='endtopic'>Looking for <span><a title='Opens the topic you are looking for in a separate tab or window' href='" + data.EndTopicUrl + "' target='_blank'>" + data.EndTopic + "<a/></span></p>"; content += "<p class='step'>Step <span>" + data.StepCount + "</span></p>"; content += "<p class='level'>Level <span>" + data.PuzzleLevel.toString() + "</span></p>"; content += "<p class='startover'><a href='/game/start/" + data.PuzzleId.toString() + "'>Start Over</a></p>"; $("#wikiheader").append(content); }, "json");
它只是注入页眉的信息。 你可以去www.wikipediamaze.com查看 ,然后login并开始一个新的难题。
在我testing的每个浏览器(Google Chrome,Firefox,Safari,Internet Explorer)中, 除了 IE 以外 ,它的function都很棒。 Eveything在IE 中首次被注入,但之后它甚至从来没有打电话给/game/getpuzzleinfo
。 就像它已经caching了结果或其他东西。
如果我改变电话到$.post("/game/getpuzzleinfo", ...
IE浏览器只是罚款,但随后Firefox退出工作。
有人可以请摆脱这一点,为什么IE浏览器caching我的$.get
ajax调用?
UPDATE
根据下面的build议,我已经改变了我的ajax请求,这解决了我的问题:
$.ajax({ type: "GET", url: "/game/getpuzzleinfo", dataType: "json", cache: false, success: function(data) { ... } });
IE对Ajax响应的积极caching是臭名昭着的。 当你使用jQuery时,你可以设置一个全局选项:
$.ajaxSetup({ cache: false });
这会导致jQuery为请求查询string添加一个随机值,从而阻止IEcaching响应。
请注意,如果您还有其他需要caching的Ajax调用,那么也会将其禁用。 在这种情况下,切换到使用$ .ajax()方法,并明确地启用该选项的必要的请求。
有关更多信息,请参阅http://docs.jquery.com/Ajax/jQuery.ajaxSetup 。
正如marr75所提到的, GET
的caching。
有几种方法可以解决这个问题。 除修改响应头之外,还可以将随机生成的查询stringvariables附加到目标URL的末尾。 这样,IE会在每次请求时都认为它是不同的URL。
有多种方法可以做到这一点(比如使用Math.random()
,date变化等)。
以下是你可以做的一个方法:
var oDate = new Date(); var sURL = "/game/getpuzzleinfo?randomSeed=" + oDate.getMilliseconds(); $.get(sURL, null, function(data, status) { // your work });
获取总是可caching的。 一种可行的策略是编辑响应头并告诉客户端不要caching信息或者很快过期。
如果您正在调用ashx页面,则还可以使用以下代码禁用服务器上的caching:
context.Response.Cache.SetCacheability(HttpCacheability.NoCache); context.Response.Cache.SetRevalidation(HttpCacheRevalidation.AllCaches);
这是我做的Ajax调用:
var url = "/mypage.aspx"; // my other vars i want to add go here url = url + "&sid=" + Math.random(); // make ajax call
它对我来说工作得很好。
NickFitz给出了一个很好的答案,但是您还需要在IE9中closurescaching。 为了只瞄准IE8和IE9你可以做到这一点;
<!--[if lte IE 9]> <script> $.ajaxSetup({ cache: false }); </script> <![endif]-->
这里的答案是非常有用的人使用jQuery或由于某种原因直接使用xmlHttpRequest对象…
如果您使用的是自动生成的Microsoft服务代理,那么解决起来就不那么简单了。
诀窍是在事件处理程序中使用Sys.Net.WebRequestManager.add_invokingRequest方法更改请求url:
networkRequestEventArgs._webRequest._url = networkRequestEventArgs._webRequest._url + '&nocache=' + new Date().getMilliseconds();
我已经写了这个:http: //yoavniran.wordpress.com/2010/04/27/ie-caching-ajax-results-how-to-fix/
刚刚写了一个关于这个确切问题的博客,只使用ExtJS( http://thecodeabode.blogspot.com/2010/10/cache-busting-ajax-requests-in-ie.html )
问题是因为我正在使用一个特定的URL重写格式,我不能使用传统的查询string参数(?param =值),所以我写了caching清除参数作为张贴variables,而不是…..我会想使用POSTvariables比GET更安全一点,因为很多MVC框架都使用这个模式
协议://主机/控制器/动作/参数1 / param2的
所以variables名到值的映射就会丢失,并且参数会被简单的堆栈…所以当使用一个GETcachingbuster参数
即protocol:// host / controller / action / param1 / param2 / no_cache122300201
no_cache122300201可能会被误认为可能有默认值的$ param3参数
即
公共职能行动($ param1,$ param2,$ param3 =“默认值”){//..//}
没有机会发生POSTEDcaching中断器
如果您正在使用Asp.net MVC,那么在控制器操作之上添加此行就足够了
[OutputCache(NoStore=true, Duration = 0, VaryByParam = "None")] public ActionResult getSomething() { }
IE是在它的权利做这个caching; 为了确保该项目不被caching,应该相应地设置标题。
如果你正在使用ASP.NET MVC,你可以写一个ActionFilter
; 在OnResultExecuted
,检查filterContext.HttpContext.Request.IsAjaxRequest()
。 如果是这样,请设置响应的过期标题: filterContext.HttpContext.Response.Expires = -1;
根据http://www.dashbay.com/2011/05/internet-explorer-caches-ajax/ :
有些人更喜欢使用Cache-Control:no-cache头而不是过期。 以下是区别:
caching控制:无caching – 绝对没有caching
失效:-1 – 浏览器“通常”通过条件If-Modified-Since请求联系Web服务器以更新该页面。 但是,该页仍保留在磁盘caching中,并在适当的情况下使用,而无需联系远程Web服务器,例如使用BACK和FORWARDbutton访问导航历史logging或浏览器处于脱机模式时。