Question

我们正在使用带有JsonP机制的动态脚本标记来实现跨域Ajax调用。前端小部件非常简单。它只调用搜索Web服务，传递用户提供的搜索条件并接收并动态呈现结果。

注意 - 对于那些不熟悉动态脚本标记的人，使用JsonP方法对返回Json格式数据的服务执行类似Ajax的请求，我可以解释如何使用它你认为它可能与问题有关。

该服务是在IIS上托管的WCF。它是Restful，所以当用户点击搜索时我们做的第一件事就是生成一个包含标准的Url。它看起来像这样......

https://.../service.svc?criteria=john+smith

然后，我们使用动态创建的Html脚本标记，其源属性设置为上面的Url，以向我们的服务发出请求。结果返回，我们处理它以显示结果。

这一切都运行正常，但我们注意到，当使用IE时，服务接收来自客户端两次的请求。我使用Fiddler来监控离开浏览器的流量，果然我看到了两个带有以下网址的请求......

请求1：https://.../service.svc?criteria=john+smith
请求2：https://.../service.svc?criteria=john+smith&_=123456789

第二个请求附有某种ID。每个请求的ID都不同。

我的直接想法是它与缓存有关。在URL的末尾添加随机数是禁用浏览器缓存的经典方法之一。为了证明这一点，我在IE中调整了缓存设置。

我将“检查存储页面的较新版本”设置为“从不” - 这导致每次只发出一个请求。最后一个随机数字。
我将此设置值恢复为默认值“自动”，请求立即开始再次发送两次。

有趣的是，我没有在客户端收到这两个请求。我发现这个reference有人建议这可能是IE的错误。在Firefox上没有发生这种事实的事实支持这一理论。

任何人都可以确认这是否是IE的错误？它可以是设计。
有谁知道我可以阻止它发生的方式？

我的用户运行的一些更模糊的搜索会占用足够的处理资源，使任何事情都变得非常糟糕。如果可能的话，我真的想避免这种情况： - ）

Answer 1

我刚写了一篇关于如何avoid caching of ajax requests的文章： - ）

它基本上涉及将无缓存标头添加到

中的任何ajax请求中

public abstract class MyWebApplication : HttpApplication
{
    protected MyWebApplication()
    {
        this.BeginRequest += new EventHandler(MyWebApplication_BeginRequest);
    }

    void MyWebApplication_BeginRequest(object sender, EventArgs e)
    {
        string requestedWith = this.Request.Headers["x-requested-with"];
        if (!string.IsNullOrEmpty(requestedWith) && requestedWith.Equals(”XMLHttpRequest”, StringComparison.InvariantCultureIgnoreCase))
        {
            this.Response.Expires = 0;
            this.Response.ExpiresAbsolute = DateTime.Now.AddDays(-1);
            this.Response.AddHeader(”pragma”, “no-cache”);
            this.Response.AddHeader(”cache-control”, “private”);
            this.Response.CacheControl = “no-cache”;
        }
    }
}

Answer 2

我最终确定了重复请求的原因。正如我所说，我选择用于进行Ajax调用的机制是动态脚本标记。我构建了请求Url，创建了一个新的Script元素并将Url分配给了src属性...

var script = document.createElement(“script”);
script.src = https://....”;

然后通过将其附加到Document Head来执行脚本。至关重要的是，我正在使用JQuery追加功能...

$(“head”).append(script);

在追加函数中，JQuery期待我正在尝试进行Ajax调用。如果要追加的元素类型是脚本，则它会执行一个特殊例程，该例程使用XmlHttpRequest对象发出Ajax请求。但是脚本仍然被附加到文档头，并且也被浏览器在那里执行。因此双重请求。

第一个直接来自剧本 - 我打算发生的那个。
第二个来自JQuery追加功能。这是以“＆amp; _ = 123456789”形式随机生成的查询字符串参数后缀的请求。

我通过阻止JQuery库副作用简化了一些事情。我使用了原生追加函数......

document.getElementByTagName(“head”).appendChild(script);

现在有一个请求以我的意图发生。我不知道JQuery追加函数内置了如此重要的副作用。

Answer 3

有关进一步的讨论，请访问www.enhanceie.com/redir/?id=httpperf。

如何防止IE缓存导致重复的Ajax请求？

3 个答案: