`
xiemingmei
  • 浏览: 207623 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
社区版块
存档分类
最新评论

浏览器缓存简单机制

阅读更多
以下内容貌似简单,但有些朋友不一定都理解清晰了。

浏览器缓存存在本地,IE的如:C:\Documents and Settings\Administrator\Local Settings\Temporary Internet Files文件夹下。浏览器取缓存内容的类型:
(1)本地缓存:直接从本地去页面缓存;
如果缓存的页面有expires(绝对时刻)或Cache-Control:max-age(时长),则在有效时间内,则取本地页面,不会给浏览器发请求。
(2)协商缓存:与web服务器协商,判断是否取浏览器缓存。
如果没有expires或max-age,则浏览器会发请求到服务器,附上If-Modified-Since报文头,web服务器则会判断页面是否在这个时间后有更新过,如没有则返回一个304状态,浏览器取本地缓存的内容;否则,服务器将返回200状态,并返回该资源和Last-Modified。


在浏览器(如IE)中有几种操作,如下:
(1)强制刷新:Ctrl + F5
浏览器将绕过本地缓存、协商缓存,让服务器重新发送请求的资源。
(2)刷新:F5
浏览器将绕过本地缓存,将使用协商缓存来请求资源。
(3)转向或回车:
浏览器将使用本地缓存、协商缓存。

ETag:
Last-Modified与If-Modified-Since是一对报文头,属于http 1.0。
ETag与If-None-Match是一对报文,属于http 1.1。
他们要实现的都是协商缓存,但Last-Modified和If-Modified-Since只判断资源的最后修改时间,而ETags和If-None-Match可以是资源任何的任何属性。

ETag机制类似于乐观锁机制,如果请求报文的ETag与服务器的不一致,则表示该资源已经被修改过来,需要发最新的内容给浏览器。

同时使用这两个报文头,在完全匹配If-Modified-Since和If-None-Match即检查完修改时间和Etag之后,如都与服务器的相符,服务器返回304,否则,发送最新内容给浏览器。










分享到:
评论

相关推荐

    浏览器缓存机制剖析

    缓存一直是前端优化的主战场,利用好缓存就成功了一半。本篇从HTTP请求和响应的头域入手,让你对浏览器缓存有个整体的概念。最终你会发现强缓存,协商缓存和启发...浏览器缓存里,Cache-Control是金字塔顶尖的规则,它

    存储篇 1:浏览器缓存机制介绍与缓存策略剖析(1).md

    我们现在站在性能优化的角度,一起简单地复习一遍这个经典的过程:首先我们需要通过 DNS(域名解析系统)将 URL 解析为对应的 IP 地址,然后与这个 IP 地址确定的那台服务器建立起 TCP 网络连接,随后我们向服务端抛...

    浅谈Ajax的缓存机制

    Ajax的缓存机制和浏览器处理资源时的缓存机制是一样的。 三条简单规则: 只要是URL相同的GET请求,浏览器会使用缓存(当然还要看服务器的Cache-Control/Expires/Last-Modified/ETag头的设置)。 只要是POST请求,...

    django开发教程之利用缓存文件进行页面缓存的方法

    浏览器缓存机制 Cache-control策略Cache-Control与Expires的作用一致,都是指明当前资源的有效期,控制浏览器是否直接从浏览器缓存取数据还是重新发请求到服务器取数据。只不过Cache-Control的选择更多,设置更细致...

    06-浏览器问题-网络问题-个人课堂总结

    内容概要:从输入URL到页面加载的全过程、浏览器重绘与重排的区别、如何触发避免重排和重绘、304过程、浏览器的缓存机制 强制缓存 && 协商缓存、进程、线程和协程区别联系、网络问题、HTTP 和 HTTPS概念区别优缺点...

    如何解决Ajax请求结果的缓存问题说明

    在某些情况下,这种默认的缓存机制并不是我们希望的(比如获取实时数据),这篇文章就来简单地讨论这个问题,以及介绍几种解决方案。目录 一、问题重现 二、通过为URL地址添加后缀的方式解决问题 三、通过JQuery的...

    浅析IE浏览器关于ajax的缓存机制

    最简单的方法就是通过给url拼接参数。利用math函数的random()方法生成随机数。  比如访问百度www.baidu.com,我们就可以把地址写成www.baidu.com?t=Math.random();或者?t=new Date().getTime();  ******

    sticky:利用最新的 HTML5 存储 API 的简单键值对浏览器存储缓存

    Sticky 是一个简单的键/值对浏览器存储缓存,利用最新的 HTML5 存储 API。 Sticky 以您的首选顺序持久保存到 indexedDB、webSQL、localStorage、globalStorage 或 cookie 之一。 特征 测试覆盖率 一切的回调 多家...

    HTML5离线缓存Manifest是什么

    web app不比PC,有性能和流量方面的考虑,离线应用越来越重要,虽然浏览器有缓存机制,但是时常不靠谱,更何况普通情况下html文件是没法缓存的,断网之后一切over。 什么是manifest? 简单来说manifest能让你的应用在...

    HTML5使用ApplicationCache接口实现离线缓存技术解决离线难题

    虽然所有浏览器都有缓存机制,但它们并不可靠,也不一定总能起到预期的作用。HTML5 使用 ApplicationCache 接口解决了由离线带来的部分难题。 使用缓存接口可为您的应用带来以下三个优势: 离线浏览 – 用户可在离线...

    简单实用的PHP文本缓存类实例

    目前很多CMS内容管理系统中频繁使用缓存机制来提高系统运行的效率。下面是一个写得不错的缓存类,可以参考下缓存的机制与写法。 cache.inc.php <?php class Cache { /** * $dir : 缓存文件存放目录 * $life...

    jQuery的缓存机制浅析

    jQuery的缓存系统在外部应用的时候都比较简单,比如要将某个URL数据存到缓存中只要这么写: 代码如下:var val = “stylechen.com”;$(“div”).data( “url” ); // 返回undefined$(“div”).data( “url”, val ); ...

    Glype在线代理程序 1.4.6.zip

    服务器端缓存,加快浏览速度 支持JavaScript 简单的页面主题 通过黑名单和白名单机制进行网址访问控制 IP黑名单 为每个链接地址生成唯一的URL 支持通过插件进行功能扩展 虚拟浏览器,可自行设置User-Agent和...

    快快浏览器KChrome v3.2.5.20417.zip

    Google搜索数据库的安全积累与沙盒机制的应用,保证了您在浏览时能杜绝99%的恶意软件侵入的机会!  安全、精简、快速、绿色,随时拷贝带走  Google服务器同步数据保存,一键恢复  快速与兼容模式随时切换,...

    RemETag_去除iis的etag_配置ETag_iis性能优化

    Etags原理:Add an Expires header已经对浏览器缓存机制中的Cache-Control和Expires进行了配置,这一条评测的是另外两个:Last-Modified和ETag。简单的说,即使设置了文件的期限,浏览器在访问资源时也会因为Last-...

    Javashop v3.0 beta2.rar

    6. 浏览器缓存处理 7. 增加上线运营模式及开发模式 二、功能 1. 订单流程完善,新增进货、配货、发货、收货流程。 2. 新增库存管理系统,支持多仓库 3. 新增团购、供应商、虚拟商品组件 4. 新增优惠劵、发票...

    浅谈利用缓存来优化HTML5 Canvas程序的性能

     使用缓存也就是用离屏canvas进行预渲染了,原理很简单,就是先绘制到一个离屏canvas中,然后再通过drawImage把离屏canvas画到主canvas中。可能看到这很多人就会误解,这不是写游戏里面用的很多的双缓冲机制么?  ...

    Java高并发高性能分布式框架从无到有微服务架构设计.doc

    高并发- HTTP缓存浏览器缓存是指当我们使用浏览器访问一些网站页面或者http服务时,根据服 务端返回的缓存设置响应头将响应内容缓存到浏览器,下次可以直接使用缓存内容或者 仅需要去服务端验证内容是否过期即可。...

    彩蛋篇:CDN 的缓存与回源机制解析(1).md

    我们现在站在性能优化的角度,一起简单地复习一遍这个经典的过程:首先我们需要通过 DNS(域名解析系统)将 URL 解析为对应的 IP 地址,然后与这个 IP 地址确定的那台服务器建立起 TCP 网络连接,随后我们向服务端抛...

Global site tag (gtag.js) - Google Analytics