ajax 清理缓存实例
ajax好处不用多说，如有：异步加载，实现局部刷新，提高用户体验，等等。
在用ajax做数据提交时，发现一个问题。每次提交之后，更新提示信息总是出现上一次的更新提示记录。
手动清理浏览器缓存之后，好像问题可以解决了。可是提交一次之后，第二次又是同样的问题。
下面看一下我做的一个小程序
做了一个小的网络投票程序，用ajax提交前台的投票数据给后台数据库。
问题要求简单描述如下：程序内部要求做好判断和提示，如果同一天内同一个IP只能限制投票一次；
如果第一次提交，则弹出“投票成功；第二次提交如果同一个主题已经存在的IP不能再次投票，则提示“不能重复投票”。
问题描述之后，似乎很简单了。
前台HTML提交的js脚本如下：
function submitVote(obj)
{
var eve=getEvent();
var chr=document.getElementsByName("netvote");
var count=0;
var selList="";
for(var i=0;i<chr.length;i++){
if(chr[i].checked){
count++;
selList+=chr[i].value+",";
}
}
if (count<1){
alert("还没有选择");
if(eve.preventDefault){eve.preventDefault();}
else{eve.returnValue=false;}
return false;
}
var postUrl="/ashx/Vote.ashx?Id="+obj+"&optionId="+selList
Request.sendGET(postUrl, cackbackResult,null,null,null);
}
function cackbackResult(req){
var str=req.responseText;
if(str=="0")//如果没有选择选项
{
alert("没有选择");
return false;
}
if(str=="001")//已经投过的
{
alert("已经投过不能重复投票");
return false;
}
if(str=="002")
{
alert("投票成功");
location.href='default.html';
}
}
后台处理代码：
public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = "text/plain";
int QId = Gain.GetQueryInt("Id", 0);//问题编号
string optionId = Gain.GetQueryString("optionId");
if (string.IsNullOrEmpty(optionId))
{
context.Response.Write("0");//没有选项
}
else if (QId > 0)
{
try
{
EEY.Lib.BLL.VoteIp bvIp = new EEY.Lib.BLL.VoteIp();
string Ip = Gain.GetUserIP;
string strWhere = string.Format("Ip='{0}' AND OptionId={1} AND DateDiff(d,voteTime,getDate())<1", Ip, QId);
if (bvIp.Exists(strWhere))
{
context.Response.Write("001");//同一个IP一天只能对某一个问题投一次票
}
else
{
int optId = 0;
string[] arry = null;
if (optionId.IndexOf(',') >= 0)
{
optionId = optionId.TrimEnd(',');
if (optionId.IndexOf(',') >= 0)//多项选择
{
arry = optionId.Split(',');
}
else
{
arry = new string[1] { optionId };
}
}
EEY.Lib.Model.VoteIp vmodel = new EEY.Lib.Model.VoteIp();
vmodel.Ip = Ip;
vmodel.OptionId = QId;
vmodel.VoteTime = DateTime.Now;
bvIp.Add(vmodel);
if (!arry.Equals(null))
{
EEY.Lib.BLL.Option bopt = new EEY.Lib.BLL.Option();
for (int i = 0; i < arry.Length; i++)
{
optId = StrUtil.ToInt32(arry[i], 0);
bopt.UpdateCount(optId);
}
int total = bopt.GetQuestionVote(QId);
EEY.Lib.BLL.Question bq = new EEY.Lib.BLL.Question();
if ( bq.UpdateVote(QId, total)>0)
{
context.Response.Write("002");//添加成功
}
}
}
}
catch (System.Exception ex)
{
context.Response.Write(ex.Message);
}
}
}
通过测试发现，提交投票时候，同一个IP的确只能投一次，即查数据库票数记录即可以知道（第一次提交之后更新票数，但第一次提交之后票数都没有变过）。
每一次在前台点击投票都提示“投票成功”，实际上是没有更新记录。
显然不是我们要的结果。因此可以断定，肯定是ajax缓存问题，存在缓存的情况下它不会每次都执行后台代码。从而可以断定是前台提交的问题，及时的提交而不是返回缓存前一次的结果。
解决办法：
在提交时加上时间戮
即在postUrl处修改为：
var postUrl="/ashx/Vote.ashx?Id="+obj+"&optionId="+selList+"&guid="+new Date().getTime();
//+"&guid="+new Date().getTime();
加上这时间之后，问题解决。显然ajax实时的返回后台处理结果，我们目的达到。OK
总结
Ajax在解决缓存时有三种办法。
1、加时间戮
对于一个浏览器，你的第一次点击是会调用rpc请求的， 但是你再用同一个浏览器提交表单的时候， rpc不会被提交， 因为参数一样， 这个可能是ajax的XMLHttpRequest对象的问题， 如设置了时间间隔了，实际上是（new ActiveXObject("Microsoft.XMLHTTP")）所以， 在实际操作的时候， 给rpc的参数传递一个没有用的guid= new Date().getTime()
一个时间戳 ，以保证每次的点击事件都会激发rpc请求， 因为这样的参数（或者说url）是不一样的。
为什么要把时间戳追加到目标url？
在某些情况下， 有些浏览器会把多个XMLHttpRequest请求的结果缓存在同一个url。如果对每个请求的响应不同，这就会带来不好的结果。把当前时间戳追加到url的最后，就能确保url的唯一性，从而避免浏览器的缓存结果。
2、在要异步获取的页面中写一段禁止缓存的代码：
Response.Buffer =True
Response.ExpiresAbsolute =Now() - 1
Response.Expires=0
Response.CacheControl="no-cache"
3、在ajax发送请求前加上xmlHTTP.setRequestHeader("If-Modified-Since","0");可以禁止缓存
xmlHTTP.open("get", URL, true);
xmlHTTP.onreadystatechange = callHTML;
xmlHTTP.setRequestHeader("If-Modified-Since","0");
xmlHTTP.send();
