蓝戒博客

  • 首页
  • 研发说
  • 架构论
  • 效能录
  • AI谈
  • 随笔集
智构苍穹
融合 AI、架构与工程实践,沉淀方法论,构建可持续的技术价值。
  1. 首页
  2. 研发说
  3. 正文

Ajax缓存问题解决方案

2016年11月7日 5706点热度 0人点赞 0条评论

AJAX的缓存产生原因:
AJAX的缓存是由浏览器维持的,对于发向服务器的某个url,ajax仅在第一次请求时与服务器交互信息,之后的请求中,ajax不再向服务器提交请求,而是直接从缓存中提取数据。
我们都知道ajax能提高页面载入的速度主要的原因是通过ajax减少了重复数据的载入,也就是说在载入数据的同时将数据缓存到内存中,一旦数据被加载其中,只要我们没有刷新页面,这些数据就会一直被缓存在内存中,当我们提交 的URL与历史的URL一致时,就不需要提交给服务器,也就是不需要从服务器上面去获取数据,虽然这样降低了服务器的负载提高了用户的体验,但是我们不能获取最新的数据。为了保证我们读取的信息都是最新的,我们就需要禁止他的缓存功能。

在IE下用Ajax请求某一页面,通常会因为缓存的原因而返回上一次的结果,造成混乱,即get方式时,获取数据,因发送参数和地址都一致,故IE浏览器会从缓存中取,而不会去请求服务器端,而post方式因为参数的不同,不会产生这个问题]而FF下不会出现这种情况。

有些情况下,我们需要每一次都从服务器得到更新后数据。思路是让每次请求的url都不同,而又不影响正常应用:在url之后加入随机内容。
e.g.

url=url+"&"+Math.random();

关键点:
1.每次请求的url都不一样(ajax的缓存便不起作用)
2.不影响正常ajax请求

解决方案有如下几种:
1.在服务端加 header("Cache-Control: no-cache, must-revalidate");(如php中)

2.在ajax发送请求前加上 anyAjaxObj.setRequestHeader("If-Modified-Since","0");

3.在ajax发送请求前加上 anyAjaxObj.setRequestHeader("Cache-Control","no-cache");

4.在 Ajax 的 URL 参数后加(随机数) "?fresh=" + Math.random(); //当然这里参数 fresh 可以任意取了

5.第五种方法和第四种类似,在 URL 参数后加上(时间戳) "?timestamp=" + new Date().getTime();

6.用POST替代GET:不推荐

如果是使用jQuery,直接这样就可以了$.ajaxSetup({cache:false})。这样页面的所有ajax都会执行这条语句就是不需要保存缓存记录。

其他方案:
模板上加上

<META HTTP-EQUIV="pragma" CONTENT="no-cache">
<META HTTP-EQUIV="Cache-Control" CONTENT="no-cache, must-revalidate">
<META HTTP-EQUIV="expires" CONTENT="Wed, 26 Feb 1997 08:21:57 GMT">
<META HTTP-EQUIV="expires" CONTENT="0">

补充:
a在sp页面中禁止缓存的代码:

Response.Buffer =True
Response.ExpiresAbsolute =Now() - 1
Response.Expires=0
Response.CacheControl="no-cache"

在JSP页面中禁止缓存代码:

response.addHeader("Cache-Control", "no-cache");
response.addHeader("Expires", "Thu, 01 Jan 1970 00:00:01 GMT");

参考资料:
1.http://www.jb51.net/article/37740.htm
2.http://www.cnblogs.com/quange/archive/2009/07/24/1529958.html

标签: ajax web技术
最后更新:2025年9月12日

cywcd

我始终相信,技术不仅是解决问题的工具,更是推动思维进化和创造价值的方式。从研发到架构,追求极致效能;在随笔中沉淀思考,于 AI 中对话未来。

打赏 点赞
< 上一篇
下一篇 >

文章评论

razz evil exclaim smile redface biggrin eek confused idea lol mad twisted rolleyes wink cool arrow neutral cry mrgreen drooling persevering
取消回复

cywcd

我始终相信,技术不仅是解决问题的工具,更是推动思维进化和创造价值的方式。从研发到架构,追求极致效能;在随笔中沉淀思考,于 AI 中对话未来。

最新 热点 随机
最新 热点 随机
开源桌面 Agent 工作台 OpenBitFun:四种模式换挡、连手机手表都能远程控场 Claude Code 默认开启 Fork 分叉子智能体,叠加每秒千字扩散模型 Mercury 3 解析 狂揽 32 万 Star,让 AI 智能体帮你“逆向一切”:深度拆解 GitHub 现象级神器 morluto/rea 与 6 大最佳实践 OpenCode 曝 1.4% 用户密钥失窃,揭秘黑客“对抗性蒸馏”黑产! Claude 全面开放 OTel 追踪、Cohere 鲸吞 500 漏洞猎手:AI 智能体彻底告别“黑盒裸奔”! 不用显卡、普通 CPU 140 毫秒出结果!Mistral 突发开源 209M 时序模型 Timestral,横扫三大权威榜单
白嫖 10 亿 Token 与云端虚拟机!Meta Muse 国内成功注册保姆级指南:手把手教你跳过排队波及 13.4 万智能体!首个零点击 RCE 漏洞 Plugin4Shell 爆发:你锁定的插件正在偷偷黑掉你的电脑阿里开源 OpenCodeReview:给大模型套上“工程缰绳”的代码审查神器大模型集体打骨折,扎克伯格把 AI 挂上钥匙扣:科技巨头们到底在琢磨什么?阿里造 10 万亿参数云端帝国,苹果用 4 台 Mac 掀了桌子:Token 租客的时代要结束了?全局代理+TUN 模式全失效?Google 突发风控,我用这一招让 Antigravity 全线复活!
马云在世界互联网大会的讲话摘录 狂赚5亿美金!2026年AI Agent风口下,普通人和企业怎么不被当“韭菜”割? Island 架构与部分水合:重新思考前端性能与交互的边界 一文吃透 npm、npx、pnpm、yarn 及其衍生命令:dlx、create、exec 的区别与最佳实践 AI生态正在换挡:从“大模型炫技”到“Agent干活”的关键一年 Bun:下一代 JavaScript 一体化工具链全面解析
最近评论
cywcd 发布于 1 个月前(09月22日) 《牛来跑酷》游戏链接地址已更新: 1. Gemini 3.7 Flash 版 牛来跑酷: htt...
渔夫 发布于 12 个月前(11月05日) 学到了,感谢博主分享
沙拉小王子 发布于 9 年前(11月30日) 适合vue入门者学习,赞一个
沙拉小王子 发布于 9 年前(11月30日) 适合vue入门者学习,赞一个
cywcd 发布于 10 年前(04月27日) 请参考一下这篇文章http://www.jianshu.com/p/fa4460e75cd8

COPYRIGHT © 2025 蓝戒博客_智构苍穹-专注于大前端领域技术生态. ALL RIGHTS RESERVED.

京ICP备12026697号-2