首页 文章

IE8的意外缓存导致IE8

提问于
浏览
134

我在使用JQuery Ajax请求的Internet Explorer缓存结果时遇到了严重问题 .

我的网页上有 Headers ,每次用户导航到新页面时都会更新 . 页面加载后,我这样做

$.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然后登录并开始新拼图来查看它 .

在我测试的每个浏览器中(谷歌浏览器,Firefox,Safari,Internet Explorer),它在IE中运行良好 except . Eveything在IE _2684465中注入得很好但在此之后它甚至从未调用 /game/getpuzzleinfo . 这就像是缓存了结果或其他东西 .

如果我将呼叫更改为 $.post("/game/getpuzzleinfo", ... IE就可以了 . 但随后Firefox退出了工作 .

有人可以就此解释为什么IE缓存我的 $.get ajax调用吗?

UPDATE

根据下面的建议,我已将我的ajax请求更改为此,这解决了我的问题:

$.ajax({
    type: "GET",
    url: "/game/getpuzzleinfo",
    dataType: "json",
    cache: false,
    success: function(data) { ... }
});

10 回答

  • 8

    IE因其对Ajax响应的积极缓存而臭名昭着 . 当您使用jQuery时,您可以设置一个全局选项:

    $.ajaxSetup({
        cache: false
    });
    

    这将导致jQuery向请求查询字符串添加随机值,从而阻止IE缓存响应 .

    请注意,如果您正在进行其他需要缓存的Ajax调用,那么这也会禁用它 . 在这种情况下,切换到使用$ .ajax()方法并为必要的请求显式启用该选项 .

    有关详细信息,请参阅http://docs.jquery.com/Ajax/jQuery.ajaxSetup .

  • 0

    正如marr75所述, GET 被缓存了 .

    有几种方法可以解决这个问题 . 除了修改响应头之外,您还可以将随机生成的查询字符串变量附加到目标URL的末尾 . 这样,IE每次请求时都会认为它是一个不同的URL .

    有多种方法可以做到这一点(例如使用 Math.random() ,日期的变体等) .

    这是你可以做到的一种方式:

    var oDate = new Date();
    var sURL = "/game/getpuzzleinfo?randomSeed=" + oDate.getMilliseconds();
    $.get(sURL, null, function(data, status) {
        // your work
    });
    
  • 3

    获取总是可缓存的 . 可能有效的一种策略是编辑响应头并告诉客户端不要缓存信息或很快使缓存失效 .

  • 2

    如果您正在调用ashx页面,您还可以使用以下代码禁用服务器上的缓存:

    context.Response.Cache.SetCacheability(HttpCacheability.NoCache);
    context.Response.Cache.SetRevalidation(HttpCacheRevalidation.AllCaches);
    
  • -1

    这就是我为ajax调用做的事情:

    var url = "/mypage.aspx";
    // my other vars i want to add go here
    url = url + "&sid=" + Math.random();
    // make ajax call
    

    它对我来说效果很好 .

  • 176

    NickFitz给出了一个很好的答案,但你也需要在IE9中关闭缓存 . 为了只针对IE8和IE9你可以做到这一点;

    <!--[if lte IE 9]>
    <script>
        $.ajaxSetup({
            cache: false
        });
    </script>
    <![endif]-->
    
  • 0

    这里的答案对于那些使用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/

  • 0

    刚刚使用ExtJS(http://thecodeabode.blogspot.com/2010/10/cache-busting-ajax-requests-in-ie.html)写了关于这个问题的博客

    问题是因为我使用特定的URL重写格式我不能使用传统的查询字符串参数(?param = value),所以我把缓存清除参数写为发布变量而不是.....我会想到的使用POST变量比GET更安全一点,因为很多MVC框架都使用这种模式

    协议://主机/控制器/动作/参数1 / param2的

    所以变量名称到值的映射会丢失,并且params只是堆叠...所以当使用GET缓存buster参数时

    即protocol:// host / controller / action / param1 / param2 / no_cache122300201

    no_cache122300201可能会被误认为是一个可能有默认值的$ param3参数

    公共功能操作($ param1,$ param2,$ param3 =“默认值”){//..//}

    没有机会发生POSTED缓存破坏者

  • 1

    如果您使用的是ASP.NET MVC,那么在控制器操作之上添加此行就足够了:

    [OutputCache(NoStore=true, Duration = 0, VaryByParam = "None")]
    public ActionResult getSomething()
    {
    
    }
    
  • 1

    IE拥有进行此缓存的权利;为了确保不缓存项目,应相应地设置 Headers .

    如果您使用的是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 - 缓存头而不是expires . 区别在于:Cache-Control:no-cache - 绝对没有缓存Expires:-1 - 浏览器“通常”通过条件联系Web服务器以获取对该页面的更新If-Modified-Since请求 . 但是,页面保留在磁盘缓存中,并在适当的情况下使用,而不联系远程Web服务器,例如,当使用BACK和FORWARD按钮访问导航历史记录或浏览器处于脱机模式时 .

相关问题