ajax 缓存 问题 requestheader

2016-02-19 10:37 8 1 收藏

想不想get新技能酷炫一下,今天图老师小编就跟大家分享个简单的ajax 缓存 问题 requestheader教程,一起来看看吧!超容易上手~

【 tulaoshi.com - Web开发 】

这样是为了减少频繁访问服务器对其造成不必要的负担,但是同时也带来了一定特殊业务逻辑满足不了的问题。
例如:
  需要通过前台一个select下拉列表来作为ajax的触发入口,同时将server返回的信息呈现在页面,并且往session或者数据库里面更新一些实际的东西的逻辑操作。
当第一次切换选项,也就是提交请求的时候一切都是正常的,但是如果切换相同选项因为浏览器的缓存原因,将不会走到server,实际得到的动态信息是从缓存中去取的。造成后台的逻辑没有被走到。代码如下:
aspx相关代码
代码如下:

asp:DropDownList ID="ddlProductList" runat="server"
asp:ListItem Value="" Selected="True"/asp:ListItem
asp:ListItem Value="null"積立利率変動型終身保険/asp:ListItem
asp:ListItem Value="QIWL"  ・QIWL(H9)/asp:ListItem
asp:ListItem Value="KIWL"  ・KIWL(H11)/asp:ListItem
asp:ListItem Value="JIWL"  ・JIWL(H15)/asp:ListItem
asp:ListItem Value="null"積立利率変動型終身保険(市場金利連動型)/asp:ListItem
asp:ListItem Value="IIWL"  ・IIWL/asp:ListItem
asp:ListItem Value="HIWL"  ・HIWL/asp:ListItem
asp:ListItem Value="null"積立利率変動型終身保険(貯蓄重視型)/asp:ListItem
asp:ListItem Value="KIWLS"  ・KIWLS/asp:ListItem
asp:ListItem Value="null"ドル建積立利率変動型終身保険/asp:ListItem
asp:ListItem Value="ODIWL"  ・ODIWL/asp:ListItem
asp:ListItem Value="JDIWL"  ・JDIWL/asp:ListItem
asp:ListItem Value="HDIWL"  ・HDIWL/asp:ListItem
asp:ListItem Value="null" 積立利率変動型養老保険(貯蓄重視型 米ドル建) /asp:ListItem
asp:ListItem Value="JDISE"  ・JDISE/asp:ListItem
/asp:DropDownList

aspx.cs代码
代码如下:

if (!IsPostBack)
{
//为doropdownlist添加客户端事件
ddlProductList.Attributes.Add("onchange", "selectChange(this)");
}

Ajax.js代码
代码如下:

var request;
function selectChange(obj) {
createHttpRequest();
var url = "AjaxService.aspx?product=" + obj.value;
request.open("GET",url,true)
request.onreadystatechange = resetRate;
request.send();
return false;
}
function createHttpRequest () {
if (window.ActiveXObject) {
request = new ActiveXObject("Microsoft.XMLHTTP");
} else if (window.XMLHttpRequest) {
request = new XMLHttpRequest();
}
}
function resetRate() {
if (request.readyState == 4) {
if (request.responseText.substring(0,1) == "#") {
document.getElementById("systemErrorMsg").innerHTML = request.responseText.substring(1);
document.getElementById("rate").innerHTML = "";
} else {
document.getElementById("rate").innerHTML = request.responseText;
document.getElementById("systemErrorMsg").innerHTML = "";
}
}
}

请求页面代码
代码如下:

protected void Page_Load(object sender, EventArgs e)
{
string productShortName = Request.QueryString["product"];
if (productShortName != null && productShortName != "null" )
{
string result = Utility.GetProductRate(packageName);
Session["rate"] = result;
Response.Write(result);
}
}

经过分析问题出在XmlHttpRequest这个对象上面,切换选项后,并不是每次走到请求页面的逻辑中。查询了相关资料解决方案如下:
request.setRequestHeader("If-Modified-Since","0");
简单的说,Last-Modified 与If-Modified-Since 都是用于记录页面最后修改时间的 HTTP 头信息,只是 Last-Modified 是由服务器往客户端发送的 HTTP 头,而 If-Modified-Since 则是由客户端往服务器发送的头,可 以看到,再次请求本地存在的 cache 页面时,客户端会通过 If-Modified-Since 头将先前服务器端发过来的 Last-Modified 最后修改时间戳发送回去,这是为了让服务器端进行验证,通过这个时间戳判断客户端的页面是否是最新的,如果不是最新的,则返回新的内容,如果是最新的,则 返回 304 告诉客户端其本地 cache 的页面是最新的,于是客户端就可以直接从本地加载页面了,这样在网络上传输的数据就会大大减少,同时也减轻了服务器的负担。
另外还有另一个解决放案,不过还未经测试,理论上应该是可行的,就是在请求页面设置一下response的header:
Response.AddHeader("Cache-control", "no-cache");

来源:http://www.tulaoshi.com/n/20160219/1595277.html

延伸阅读
标签: Web开发
产生原因 主要有2个原因 1 xtmlhttp 返回的数据默认的字符编码是utf-8,如果前台页面是gb2312或者其它编码数据就会产生乱码 2 post方法提交数据默认的字符编码是utf-8,如果后台是gb2312或其他编码数据就会产生乱码 解决方法 进一步整理中 推荐方法,前台后台都用utf-8编码,这样可以省不少麻烦,从根本上解决了乱码问题.优点是效率高,而且符合目...
标签: Web开发
这样的情况是是为AJAX获取时先检查本机缓存,如果本机缓存已有相同内容,则不访问远端服务器。这样的操作倒是可以提高速度和减少服务器压力。但带来的弊端也是显而易见的。 为了解决这个问题。我们必须在获取页加上一个额外的参数。比较简单的方法是用一个随机数。 例子如下  代码如下: function idCheck() { //参数调用函数 var f...
标签: Web开发
网上有很多解决这个问题的方法,试了一下都不好用,自己就对于这些方法测试了一下,然后逐个排除无用的设置,最后得到了最简单的方案。 js代码: 得到XmlHttpRequest的类 Code 1function HttpRequest() 2{ 3 //取得Request对象 4 this.Request=function(){ 5 try 6 { 7 if(window.XMLHttpRequest) request=new XMLHttpRequest(); 8 if(!reque...
标签: Web开发
用$.ajax()时我设置了超时时间为3秒: 代码如下: $.ajax({ url: "ajaxTable1.aspx", cache: false, error: function(XMLHttpRequest, textStatus, errorThrown) { // }, success: function(html) { // }, timeout: 3000 }); ajaxTable1.aspx页面中我通过Thread.Sleep(1000 * 5); 使页面延迟5秒后再继续执行,所以ajax请求会超...
标签: Web开发
网页制作Webjx文章简介:要解决ajax跨域问题,网上给出的方法有二. 要解决ajax跨域问题,网上给出的方法有二: 1是构建服务器端的代理。简而言之,就是ajax中调用的实质还是本机的url,而服务器端替js去取回远端地址。 2.利用script标记,生成一个标签。在js加载完成后,再执行后续操作。 就是将原来新建xmlHTT...

经验教程

939

收藏

41
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部