缓存AJAX的请求
|
在客户端缓存Ajax请求
浏览器可以缓存图片、js文件、css文件,同样浏览器也可以缓存XML Http调用(当然这需要XML Http以get方式发送调用),这种缓存基于URL,当我们发送一个请求时,如果和以前请求的URL相同,那么浏览器就会从缓存中响应,而不是从重新请求服务器,这可以节省一些时间。通常来说,浏览器会缓存所有的Http get请求的结果,所以如果我们让XML Http以get方式发送请求,并且服务器返回特定的header告诉浏览器缓存结果,那么在以后的请求中,我们就可以直接从缓存中得到响应,从而节约了大量的时间。 在PageFlakes网站中,作者缓存了用户状态,所以如果用户重新登录网站,用户将会从浏览器缓存中得到一个缓存的页面而不是重新请求服务器,所以第二次访问是快很多,另外作者还缓存了许多用户的操作结果,所以当用户重新做相同的动作时,被缓存的结果会迅速的出现,这就使用户得到了更好的体验。 所以如果以http get方式调用Ajax请求时,我们应该返回特定的http header以告诉浏览器缓存请求的结果。下面是两种不同的方式,我们可以采取其中之一: HTTP/1.1 200 OK Expires: Fri, 1 Jan 2030 Cache-Control: public 上面的header告诉浏览器将请求结果缓存到2030年,所以如果我们在2030年之前发出同样的xml http请求,浏览器都会直接从缓存中读取结果,而不用重新请求服务器。另外还有一种更高级的header用来控件请求结果的缓存,下面的header指示浏览器也将请求结果缓存60分钟,并在60分钟后重新请求结果, HTTP/1.1 200 OK Cache-Control: private, must-revalidate, proxy-revalidate, max-age=60
好的应用浏览器缓存使用一致的URL浏览器缓存的基础是URL,当一个URL改变时,浏览器就会从服务器重新请求页面。我们可以通过不同的查询参数来改变URL,例如我们在缓存中缓存了default.aspx页面,如果我们再请求default.aspx/?1页面,这时虽然是相同的操作,但浏览器仍会重新请求服务器,另外如果在Header中做了设置,新的请求结果也会被缓存。因此我们要确保使用一致的URL。一个常见的错误是在是URL中省略www,例如https://www.cnblogs.com/yijieyufu/和和cnblogs.com/yijieyufu/会被分别缓存会被分别缓存 将静态内容的缓存周期设的长些静态文件可以设置一个长的缓存周期,比如一个月。如果你认为你应该缓存两天,这样当你改变了文件后,用户就可以很快的得到新的文件,这就你错了,当你更新了一个被expires缓存的文件后,新用户会立即得到更改后的文件,而老用户只有在缓存到期后才能得到更改后的文件。所以只要你应用了Expires去缓存静态文件,就应该将过期周期设的尽可能地大。 例如如果你将一个静态文件的缓存周期设为三天,一个用户A在今天访问页面并将其缓存三天,另一个用户B在明天访问页面并同样缓存页面。所以如果你在后天改变了文件,那么用户A将会在第四天看到新文件,用户B将会在第五天看到新文件,这就会导致不同的用户看到不同的文件,这不是我们想要的结果,所以如果我们更改了文件并将想让用户立即看到更改后的文件,我们应该通过不同的URL来访问文件。 |
缓存AJAX的请求的更多相关文章
- 唯独ie浏览器缓存ajax请求
用fiddler调试http请求,在ie浏览器下,如果请求命中缓存,fiddler不会包含该请求.但是在chrome下会包含缓存的请求,Result显示为304. ie浏览器还会缓存通过ajax请求的 ...
- 学习AJAX必知必会(3)~自动重启工具nodemon、缓存问题、请求超时和网络异常、取消重复请求
1.nodemon 自动重启工具(自动重启基于nodejs开发的服务端应用) ■ nodemon 是一个工具,通过在检测到目录中的文件更改时自动重新启动node应用程序来帮助开发node.js. // ...
- Ajax异步请求-简单模版
<script type="text/javascript"> window.onload = function () { document.getElementByI ...
- ajax异步请求不能刷新数据的问题
搞了两三天的问题,今天解决了.总结下: function reportGrpChange(cuid, title){ document.getElementById('reportFrameDiv') ...
- ajax数据请求5(php格式)
ajax数据请求5(php格式): <!DOCTYPE html> <html> <head> <meta charset="UTF-8" ...
- ajax数据请求4(xml格式)
ajax数据请求4(xml格式): <!doctype html> <html> <head> <meta charset="utf-8" ...
- ajax数据请求3(数组json格式)
ajax数据请求3(数组json格式) <!doctype html> <html> <head> <meta charset="utf-8&quo ...
- Ajax的请求规范(二)
第一种方式:send()不带参数 function doAjax(url,fnSucc,fnFaild) { //1.创建Ajax对象 if (window.XMLHttpRequest) {//判断 ...
- AJAX 创建对象 请求 响应 readyState
AJAX 创建对象 请求 响应 readyState AjAX = Asynchronous JavaScript and XML (异步的JavaScrip和 XML). 不是新的编程语言, 而是一 ...
随机推荐
- 牛客NOIP暑期七天营-提高组2
第一题:ACGT 题目链接:https://ac.nowcoder.com/acm/contest/931/A trie树.hash.map遍历 ①.trie树上的节点多记一个rest值表示还有多少 ...
- 【转载】img图片之间的间距问题
[问题]页面中如果有多张图片,那么图片之间会有一些间距,在某些情况下(如切好的图片再次拼接),在显示上就会出现一些问题.效果如下: 解决方案参看以下文章 img图片之间的间距问题
- 分布式全文搜索引擎ElasticSearch—超详细
1 ElasticSearch 1.1 ES的概念和特点 ES:全文检索的框架,专门做搜索,支持分布式.集群.封装的Lucene. 特点: 原生的Lucene使用的不足,优化了Lucene的调用方式 ...
- AI: Web: 2 Vulnhub Walkthrough
靶机下载链接: https://www.vulnhub.com/entry/ai-web-2,357 主机端口扫描: 尝试SQL注入,未发现有注入漏洞,就注册创建于一账户 http://10.10.2 ...
- PMBOK 指南 第四章 项目整合管理(4.1-4.3)
项目整合管理 包括对隶属于项目管理过程组的各个过程和项目管理活动进行识别.定义.组合.统一和协调的各个过程. 资源分配.平衡竞争性需求.研究各种备选方法.为实现项目目标而裁剪过程.管理各个项目管理知识 ...
- 剑指offer-47:不用加减乘除做加法
参考:https://www.cnblogs.com/zhangziqiu/archive/2011/03/30/ComputerCode.html <原码,反码,补码 详解> 题目描述 ...
- ZKWeb网页框架2.2.1正式发布
2.2.1 更新的内容有 改进 EFCore 支持 支持自动 json 序列化字段 (通过 WithSerialization 选项) 支持懒加载 更新后 EFCore 可以使用所有默认插件 (ZKW ...
- JS完美拖拽
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>& ...
- Promise代码详解(show you the code)
认识异步函数 同步函数: const sum1 =(a,b)=>{ return a+b } console.log('AAA'); console.log(sum(5,6)); conosle ...
- 遇见手绘花卉小清新简约通用PPT模板推荐
模版来源:http://ppt.dede58.com/jiaoxuekejian/26484.html