开发者社区> 问答> 正文

有关jquery中ajax的缓存问题

我要做的是一个级联的省市区的联动下拉框,就是选择了省,然后异步读取该省的市的列表,如此类推。
=====================先粘贴我的代码============================
1.js中我是这样写的:

jQuery.ajax({
    url:'ajaxGetList.do',
    data:{parentId: parentId==''?'':parentId, level: level!=-1?'':'0'},
    ifModified:true,
    cache:true,
    success:function(data){
        alert('success:'+data);//to set list..........
    },
    contentType: 'application/json',
    dataType:'json'
});

2.服务器端的响应代码:

public List<Map<String, Object>> getConcatenationList(HttpServletResponse response,@RequestHeader(required=false,value="IF-None-Match") String ifNoneMatch) {
    if(ConcatenationHelper.checkEtag(RegionInfo.class, ifNoneMatch)) {
        response.setStatus(304);
        return null;
    } else {
        response.addHeader("Etag", etag);
//这里的ETAG是该请求内容的最新更新的时间戳
//TODO:(取得要显示的列表)
    }
}

按上面的代码就可以使用缓存来异步获取数据了,测试时,首次点选某个省A(即第一个下拉框)时,是读取数据库的数据,取出来后能正常显示该省的市列表,点选其他省B后,再点选最初选择的省A,这个时候由于服务端返回了304状态码,这样服务端就不用再发送资源到客户端了,而直接使用cache,但这第二次选择省A的success函数中,alert显示的data却是undefined,为什么呢?是我遗漏了什么地方吗?应该怎么解决这个问题?
(P.S. 我用FireFox浏览器的,在首次点选省A时,用这个浏览器查过,确实有生成对应的缓存的,但第二次选省A时,缓存就不见了..)

可参考下面的网址:
http://www.cnblogs.com/heyuquan/archive/2013/05/13/js-jquery-ajax.html
然后搜索关键字[cache和ifModified参数]
只不过那里举的例子是使用Last-Modified,而我使用ETag而已。

展开
收起
云栖技术 2016-05-25 09:48:59 2388 0
1 条回答
写回答
取消 提交回答
  • 社区爱好者,专为云栖社区服务!

    应该把 ifModified: true 去掉。

    仔细看一下你参考的文章:

    当你请求的资源并不是一层不变的时候,即不能简单的一直使用客户端缓存时,你可能通过将cache设置为false来发送请求,这实际上是在url加上时间戳组合成新的url,每次发送新的请求,这明显加大了服务器的压力。
    对于这种情况,我们可以通过ifModified参数改进缓存方式(即:cache和ifModified都设置为true),……
    他针对的是资源变动比较频繁的情况,希望时刻获取最新的文件,而你应该是想要尽量使用缓存吧。

    正常情况下如果接收到 304,浏览器会主动把缓存内容和状态 200 返回给 xhr 对象,一旦设置了 ifModified: true,从第二次请求开始,就没有了浏览器的处理过程,jQuery 直接接收到一个 304 和空内容。

    另外 contentType: 'application/json' 也用得不正确,一般情况下不用设置这个值。

    2019-07-17 19:13:31
    赞同 展开评论 打赏
问答排行榜
最热
最新

相关电子书

更多
高性能Web架构之缓存体系 立即下载
分布式高并发缓存6.0 立即下载
用户态高速块缓存方案 立即下载