使用时间戳解决浏览器缓存问题

在IE或者其他的很多浏览器中,如果你每次请求的地址是相同的,浏览器就不会去连接服务器而是去读取缓存,这

样对于很多应用来时是非常好的,可以降低服务器的压力或者减少带宽的使用,但是对于ajax应用,很多都是必须保持

时时的连接与服务器进行交互,所以需要使用一个小技巧,时间戳来使每次的请求地址都不同,从而跳过浏览器的缓存

机制实现每次的请求服务器,这样的功能在图片验证码的时候也是比较常用的一种方法。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">  
<html>  
  <head>  
    <title>ajax.html</title>  
    <script type="text/javascript" src="/Ajax/js/jquery-1.7.2.js"></script>  
    <script type="text/javascript">  
        function test(){  
            //1.获取文本框中的值  
            var value = $("#userName").val();  
            //2.将文本框中的内容发送给后台服务器  
            var url = "/Ajax/servlet/AjaxServlet?name="+value;  
            url = convertURL(url);  
            alert(url);  
            $.get(url,null,callback);  
        }  
        //给url地址增加时间戳,骗过浏览器,不读去缓存  
        function convertURL(url){  
            var timestmp = (new Date()).valueOf();  
            //将时间戳追加到url上面  
            url = url+ "&t=" +timestmp;  
            return url;   
        }  
          
        function callback(data){//回调函数  
            //3.接受服务器的返回的数据  
            //alert(data);  
            //4.将结果显示在页面中  
            $("#div1").html(data);  
        }  
    </script>  
  </head>  
    
  <body>  
    用户名:<input type="text" id="userName" onblur="test();"/><span id="div1" style="color: red"></span>  
    <br/>  
    密码:<input type="password" id="password" /><br/>  
    邮箱:<input type="text" id="mail" />  
  </body>  
</html>  

未加时间戳效果:


添加时间戳效果:


猜你喜欢

转载自blog.csdn.net/nlznlz/article/details/77991377
今日推荐