AJAX 缓存处理

来源：互联网发布：防范电信网络诈骗案例编辑：程序博客网时间：2024/05/17 04:47

关于AJAX请求服务器后缓存数据,造成没有及时刷新的问题

原文地址：http://blog.csdn.net/ipooy/article/details/5751582

最近在做项目的时候,使用了ajax去请求服务器的数据!刚开始还可以，我测试一切运行正常（我不是专业的测试人员哈!所以还是有些问题没有测出来哈）!后来ajax请求的数据变化了,但是页面数据没有变，依然是第一次的数据!这个问题害我整了好大半天啊![还是自己技术不到位啊！] 没办法遇到问题还是要解决啊!只有硬着头皮弄了撒! 因为ajax请求也是到后台页面执行的,那就断点吧! 嘿嘿，通过断点我发现了问题! 每次ajax请求他只有第一次去后台，后面的他就不会去后台了!如果你其他按钮把数据改变了，因为ajax第二次以后都不会去后台执行去数据了!所以数据没有及时刷新[数据被缓存了,如果你重启IE你修改的数据就可以看到了]，有点希望了! 至少症状找到了撒！接下就是怎么解决这个问题啊! 嘿，后来和Bobby同事提醒我在ajax的请求url后面加一个时间戳参数试一试! 那就死马当活马医了!反正我也没有好的方法! 哈哈居然可以了! [在此感谢bobby]（还是自己技术不到位啊！汗…）后来去google了一下，多少人也遇到这个问题! 下面集自己的理解和网络上的一些资源解决这个问题! [IE中如果XMLHttpRequest提交的URL与历史一样则使用缓存，根本不向服务器端提交。因此无法取到刚提交的数据]（据本人测试，只有在GET方式下才会产生这种不向服务器提交的问题）

我最初的做法: 下面的代码运行后! 第一次点击GetData按钮显示 demo , 当在点击changDate改变数据后, 在点击 GetData还是显示 demo ！而不是我们期望的changed data 字符串! 这就是我最初遇到的问题! 当然下面只是一个简单的demo而没有太多的实际意义!

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="ajax_Default" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head runat="server">    <title></title>    <script runat="server">        private static string data = "demo";        protected void Page_Load(object sender, EventArgs e)        {            if (IsPostBack) return;            if (!string.IsNullOrEmpty(Request.QueryString["ajax"]))            {                Response.Write(data);                Response.End();            }        }        protected void Unnamed1_Click(object sender, EventArgs e)        {            data = "Changed data";        }    </script>    <script type="text/javascript">        function createXmlHttpRequest() {            if (window.ActiveXObject) {                return new ActiveXObject("Microsoft.XMLHTTP");            } else if (window.XMLHttpRequest) {                return new XMLHttpRequest();            }        }        function test() {            //ajax请求地址,就是本页面哈            var url = "Default.aspx?ajax=true";            /*                解决方法: var url = "Default.aspx?ajax=true&random=" + Math.random();                         var url = "Default.aspx?ajax=true&random=" + new Date().getMilliseconds();                后面跟一个随机数或者时间戳保证他请求的url每次都不一样!这样就不会被缓存                2.在send()方法之前设置setRequestHeader                  XMLHttpRequest.setRequestHeader("If-Modified-Since","0")            */            var xmlHttpRequest = createXmlHttpRequest();            xmlHttpRequest.onreadystatechange = function() {                if (xmlHttpRequest.readyState == 4 && xmlHttpRequest.status == 200) {                    var context = xmlHttpRequest.responseText;                    document.getElementById("divInfo").innerHTML = context;                }            }            xmlHttpRequest.open("GET", url, true);            //xmlHttpRequest.setRequestHeader("If-Modified-Since","0");            xmlHttpRequest.send(null);        }    </script></head><body>    <form id="form1" runat="server">    <input id="getData" type="button" value="GetData" onclick="test();" />    <div id="divInfo">        </div>    <asp:Button runat="server" Text="changDate" onclick="Unnamed1_Click" />    </form></body></html>