zoukankan      html  css  js  c++  java
  • ajax请求-IE缓存处理


    IE浏览器下使用GET发送请求时,如果两次请求的地址和参数相同,在不刷新页面的情况下,浏览器会缓存第一次的请求的内容,服务端更新后浏览器仍然显示第一次的内容
    如在当前页面用户登录,在未登录的情况下,服务器返回的用户信息为空,点击登录后发起请求返回的用户信息仍然是为空,这是因为浏览器会对GET请求做缓存处理。
    解决办法:
    1.GET请求URL后加随机数,让服务器认为不是相同的请求。也可以传一个随机的参数
    eg:http://dev.example.com/Example/GetFormation?t="+new Date().getTime()
    var timstamp = (new Date).valueOf();
    if (('/Example/' + urls[i]).indexOf("?") >= 0) {
    url = '/Example/' + urls[i] + "&t=" + timstamp;
    } else {
    url = '/Example/' + urls[i] + "?t=" + timstamp;
    };
    2.在ajax发送请求前加上xmlHttpRequest.setRequestHeader("If-Modified-Since","0")
    If-Modified-Since讲解:http://www.cnblogs.com/zh2000g/archive/2010/03/22/1692002.html
    https://developer.mozilla.org/zh-CN/docs/Web/HTTP/Headers/If-Modified-Since
    3.在ajax发送请求前加上xmlHttpRequest.setRequestHeader("Cache-Control","no-cache")
    4.使用post请求代替get请求,浏览器不会对post请求做缓存

    AJAX的缓存产生原因:
    AJAX的缓存是由浏览器维持的,对于发向服务器的某个url,ajax仅在第一次请求时与服务器交互信息,之后的请求中,ajax不再向服务器提交请求,而是直接从缓存中提取数据。
    我们都知道ajax能提高页面载入的速度主要的原因是通过ajax减少了重复数据的载入,也就是说在载入数据的同时将数据缓存到内存中,一旦数据被加载其中,只要我们没有刷新页面,这些数据就会一直被缓存在内存中,当我们提交 的URL与历史的URL一致时,就不需要提交给服务器,也就是不需要从服务器上面去获取数据,虽然这样降低了服务器的负载提高了用户的体验,但是我们不能获取最新的数据。为了保证我们读取的信息都是最新的,我们就需要禁止他的缓存功能。

    在IE下用Ajax请求某一页面,通常会因为缓存的原因而返回上一次的结果,造成混乱,即get方式时,获取数据,因发送参数和地址都一致,故IE浏览器会从缓存中取,而不会去请求服务器端,而post方式因为参数的不同,不会产生这个问题]而FF下不会出现这种情况。

    有些情况下,我们需要每一次都从服务器得到更新后数据。思路是让每次请求的url都不同,而又不影响正常应用:在url之后加入随机内容。
    e.g.

    url=url+"&"+Math.random();

    关键点:
    1.每次请求的url都不一样(ajax的缓存便不起作用)
    2.不影响正常ajax请求

    解决方案有如下几种:
    1.在服务端加 header("Cache-Control: no-cache, must-revalidate");(如php中)

    2.在ajax发送请求前加上 anyAjaxObj.setRequestHeader("If-Modified-Since","0");

    3.在ajax发送请求前加上 anyAjaxObj.setRequestHeader("Cache-Control","no-cache");

    4.在 Ajax 的 URL 参数后加(随机数) "?fresh=" + Math.random(); //当然这里参数 fresh 可以任意取了

    5.第五种方法和第四种类似,在 URL 参数后加上(时间戳) "?timestamp=" + new Date().getTime();

    6.用POST替代GET:不推荐

    如果是使用jQuery,直接这样就可以了$.ajaxSetup({cache:false})。这样页面的所有ajax都会执行这条语句就是不需要保存缓存记录。

    其他方案:
    模板上加上

    <META HTTP-EQUIV="pragma" CONTENT="no-cache">
    <META HTTP-EQUIV="Cache-Control" CONTENT="no-cache, must-revalidate">
    <META HTTP-EQUIV="expires" CONTENT="Wed, 26 Feb 1997 08:21:57 GMT">
    <META HTTP-EQUIV="expires" CONTENT="0">

    补充:
    a在sp页面中禁止缓存的代码:

    Response.Buffer =True
    Response.ExpiresAbsolute =Now() - 1
    Response.Expires=0
    Response.CacheControl="no-cache"

    在JSP页面中禁止缓存代码:

    response.addHeader("Cache-Control", "no-cache");
    response.addHeader("Expires", "Thu, 01 Jan 1970 00:00:01 GMT");

  • 相关阅读:
    记录一个bug关于radio的
    at notFoundError …@cross-spawnlibenoent.js: 报错解决
    关于目前高清屏幕150%适配需要注意的样式写法
    记录一个css样式覆盖的问题。
    video.js使用详解(转载)
    记录一次node版本更新的问题,node的exe版本安装不上去。
    webstorm左侧导航栏背景变成黄色的,文件搜索,定位等一系列功能都不好用了?
    SCRIPT5007: 无法获取未定义或 null 引用的属性“xxx”
    VMWare中安装CentOS6.6不能上网的解决办法
    Unity出现 error building player exception android (invocation failed)
  • 原文地址:https://www.cnblogs.com/jcxfighting/p/8033530.html
Copyright © 2011-2022 走看看