本文导读:浏览器缓存机制,其实主要就是HTTP协议定义的缓存机制。客户端缓存是否需要是可以在服务端代码上控制的。那就是响应头。响应头告诉缓存器不要保留缓存,缓存器就不会缓存相应内容;如果请求信息是需要认证或者安全加密的,相应内容也不会被缓存。那么,HTTP请求中浏览器是如何缓存数据呢?
一、HTTP请求中浏览器缓存流程图
1、浏览器第一次请求
2、浏览器再次请求时
二、HTTP请求中浏览器缓存流程的文字描述
1、当资源第一次被访问的时候,HTTP头部如下
(Request-Line) GET /a.html HTTP/1.1
Host 127.0.0.1
User-Agent Mozilla/5.0 (X11; U; Linux i686; zh-CN; rv:1.9.0.15) Gecko/2009102815 Ubuntu/9.04 (jaunty) Firefox/3.0.15
Accept text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language zh-cn,zh;q=0.5
Accept-Encoding gzip,deflate
Accept-Charset gb2312,utf-8;q=0.7,;q=0.7
Keep-Alive 300
Connection keep-alive
HTTP返回头部如下
(Status-Line) HTTP/1.1 200 OK
Date Thu, 26 Nov 2009 13:50:54 GMT
Server Apache/2.2.11 (Unix) PHP/5.2.9
Last-Modified Thu, 26 Nov 2009 13:50:19 GMT
Etag "8fb8b-14-4794674acdcc0"
Accept-Ranges bytes
Content-Length 20
Keep-Alive timeout=5, max=100
Connection Keep-Alive
Content-Type text/html
当资源第一次被访问的时候,http返回200的状态码,并在头部携带上当前资源的一些描述信息,如
Last-Modified // 指示最后修改的时
Etag // 指示资源的状态唯一标识
Expires // 指示资源在浏览器缓存中的过期时间
接着浏览器会将文件缓存到Cache目录下,并同时保存文件的上述信息
2、当第二次请求该文件时
浏览器会先检查Cache目录下是否含有该文件,如果有,并且还没到Expires设置的时间,即文件还没有过期,那么此时浏览器将直接从Cache目录中读取文件,而不再发送请求
如果文件此时已经过期,则浏览器会发送一次HTTP请求到WebServer,并在头部携带上当前文件的如下信息
If-Modified-Since Thu, 26 Nov 2009 13:50:19 GMT
If-None-Match "8fb8b-14-4794674acdcc0"
即把上一次修改的时间,以及上一次请求返回的Etag值一起发送给服务器。服务器在接收到这个请求的时候,先解析Header里头的信息,然后校验该头部信息。
如果该文件从上次时间到现在都没有过修改或者Etag信息没有变化,则服务端将直接返回一个304的状态,而不再返回文件资源,状态头部如下
(Status-Line) HTTP/1.1 304 Not Modified
Date Thu, 26 Nov 2009 14:09:07 GMT
Server Apache/2.2.11 (Unix) PHP/5.2.9
Connection Keep-Alive
Keep-Alive timeout=5, max=100
Etag "8fb8b-14-4794674acdcc0"
这样,就能够很大程度上减少网络带宽以及提升用户的浏览器体验。
当然,如果服务器经过匹配发现文件修改过了,就会将文件资源返回,并带上新文件状态信息。
三、浏览器缓存行为还有用户的行为有关!
用户操作 |
Expires/Cache-Control |
Last-Modified/Etag |
地址栏回车 |
有效 |
有效 |
页面链接跳转 |
有效 |
有效 |
新开窗口 |
有效 |
有效 |
前进、后退 |
有效 |
有效 |
F5刷新 |
无效 |
有效 |
Ctrl+F5刷新 |
无效 |
无效
|
相关推荐
描述了web浏览器,关于HTTP缓存机制的流程
Expires是一个较老的强缓存管理header,它包含一个GMT格式的绝对时间字符串,告诉浏览器在这个时间之前可以直接从浏览器缓存中加载资源,而无需去服务器校验。然而,Expires存在一个潜在的问题,那就是它依赖于...
浏览器之HTTP缓存的那些事 什么是浏览器缓存 浏览器HTTP执行机制 缓存模式 缓存相关的Http Header Cache-Control Expires Last-Modified ETag
浏览器缓存,有时候我们需要他,因为他可以提高网站性能和浏览器速度,提高网站性能。但是有时候我们又不得不清除缓存,因为缓存可能误事,出现一些错误的数据。像股票类网站实时更新等,这样的网站是不要缓存的,像...
最近在项目发布的过程中,我经常会遇到这种情况。发布的静态文件(包括图片、js文件、css文件等等)在浏览器中未生效。针对此种情况,我在网上找...一、针对第一种可能性,主要涉及到的是http请求及响应中头部的Cache-
简要来说,很多网站第二次访问能够秒开,是因为这些网站把很多资源都缓存在了本地,浏览器缓存直接使用本地副本来回应请求,而不会产生真实的网络请求,从而节省了时间。同时,DNS 数据也被浏览器缓存了,这又省去了...
我们往往在服务器上对缓存设置进行... 其实浏览器在发送请求的时候会先发送http头,一般象这样:Date: Sun, 30 Jul 2006 09:18:11 GMTContent-Type: image/gifLast-Modified: Wed, 19 Jul 2006 07:40:06 GMTETag: “8c5
OutputCache是针对所有访问服务器资源的用户,本篇要介绍的浏览器缓存则是针对单个用户,让浏览器在我们的控制下彻底不持续访问服务器上的动态内容,也就是我们要让浏览器变成我们的缓存机制中的一部分,在某些特定...
浏览器缓存是浏览器在本地磁盘对用户最近请求过的文档进行存储,当访问者再次访问同一页面时,浏览器就可以直接从本地磁盘加载文档。 所以根据上面的特点,浏览器缓存有下面的优点: 减少冗余的数据传输 减少...
本篇从HTTP请求和响应的头域入手,让你对浏览器缓存有个整体的概念。最终你会发现强缓存,协商缓存和启发式缓存是如此的简单。浏览器对于请求资源,拥有一系列成熟的缓存策略。按照发生的时间顺序分别为存储策略、...
HTTP 请求,服务端处理完我们的请求之后,把目标数据放在 HTTP 响应里返回给客户端,拿到响应数据的浏览器就可以开始走一个渲染的流程。渲染完毕,页面便呈现给了用户,并时刻等待响应用户的操作(如下图所示)。 !...
浏览器缓存(Browser Caching) 是为了加速浏览并节约网络资源,浏览器在用户磁盘上对最近请求过的文档进行存储。 nginx可以通过 expires 指令来设置浏览器的Header 语法: expires [time|epoch|max|off] 默认值: ...
Expires是Web服务器响应消息头字段,在响应http请求时告诉浏览器在过期时间前浏览器可以直接从浏览器缓存取数据,而无需再次请求。 Cache-control策略(重点关注) Cache-Control与Expires的作用一致,都是指明当前...
Cachebuster是Magento模块,它使用HTML5样板社区中概述的最佳实践,帮助从HTTP缓存(例如浏览器缓存,CDN,Varnish等)自动清除静态资产。 请参阅以下部分中的“基于文件名的缓存清除”部分: : 受影响的网址:...
在URL中拼入随机的查询字符串可以使浏览器认为这是一个新的请求,从而不使用缓存。 在Ajax的请求中设置Http头: If-Modified-Since:0,告诉服务器要新的内容。 补充说明: 一般情况下,用户手动触发浏览器刷新
经过一番探索微信浏览器确实是在webview的上层做的缓存:就是如果请求过了这个地址,就会存在本地,之后不取线上了。 解决方案是在调试阶段或者频繁更新的页面加入以下头信息 复制代码代码如下:<meta http-equiv=...
AJAX的缓存是由浏览器维持的,对于发向服务器的某个url,ajax仅在第一次请求时与服务器交互信息,之后的请求中,ajax不再向服务器提交请求,而是直接从缓存中提取数据。 有些情况下,我们需要每一次都从服务器得到...
GET 请求保留在浏览器历史记录中 GET 请求可被收藏为书签 GET 请求参数在URL中的是可见的 GET 请求有长度限制 1、在浏览器上表现的区别 GET和POST使用区别 POST POST 请求不会被缓存 POST 请求不会保留在浏览器历史...
最近学习下优化网站性能的方法,其中有一个是为文件头指定Expires或Cache-Control,具体来说指对于静态内容设置文件头过期时间Expires的值为Never expire永不过期