`
coding1688
  • 浏览: 237546 次
  • 来自: 上海
社区版块
存档分类
最新评论

HTTP协议中与浏览器缓存有关的部分

阅读更多

本文来自:http://www.vktone.com/articles/http_browser_cache.html   (原文可能会更新,请感兴趣的朋友直接访问)

1. 缓存协商

1.1)Last-Modified响应头 和 If-Modified-Since请求头

首次访问一个页面时,Web服务器可能会生成Last-Modified响应头,表示文件的最后修改时间。

请求头信息示例:

GET /articles/cpc18.html HTTP/1.1
Host: www.vktone.com
User-Agent: Mozilla/5.0 (Windows NT 6.1; rv:16.0) Gecko/20100101 Firefox/16.0
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: zh-cn,zh;q=0.8,en-us;q=0.5,en;q=0.3
Accept-Encoding: gzip, deflate
Connection: keep-alive
Referer: http://www.vktone.com/
Cookie: Hm_lvt_0349e3f0156bf70cd93447e10ddda4bb=1352731512700,1352967797808; Hm_lpvt_0349e3f0156bf70cd93447e10ddda4bb=1352967808911
Pragma: no-cache
Cache-Control: no-cache

响应头信息示例:

HTTP/1.1 200 OK Date: Thu, 15 Nov 2012 08:52:42 GMT Content-Length: 19737 Content-Type: text/html Content-Location: http://www.vktone.com/articles/cpc18.html Last-Modified: Thu, 15 Nov 2012 08:12:19 GMT Accept-Ranges: bytes Etag: "3e1eecee8c3cd1:3b78f" Server: Microsoft-IIS/6.0 X-Powered-By: ASP.NET
这时浏览器便会缓存 Last-Modified 值,但再次访问的时候(强制刷新除外)就会发送 If-Modified-Since请求头
GET /articles/cpc18.html HTTP/1.1
Host: www.vktone.com
User-Agent: Mozilla/5.0 (Windows NT 6.1; rv:16.0) Gecko/20100101 Firefox/16.0
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: zh-cn,zh;q=0.8,en-us;q=0.5,en;q=0.3
Accept-Encoding: gzip, deflate
Connection: keep-alive
Cookie: Hm_lvt_0349e3f0156bf70cd93447e10ddda4bb=1352731512700,1352967797808; Hm_lpvt_0349e3f0156bf70cd93447e10ddda4bb=1352969794340
If-Modified-Since: Thu, 15 Nov 2012 08:12:19 GMT
If-None-Match: "3e1eecee8c3cd1:3b78f"
如果请求的文件没有改变,则Web服务器返回304状态,浏览器将从缓存中得到文件内容
HTTP/1.1 304 Not Modified
Date: Thu, 15 Nov 2012 08:56:53 GMT
Content-Location: http://www.vktone.com/articles/cpc18.html
Last-Modified: Thu, 15 Nov 2012 08:12:19 GMT
Accept-Ranges: bytes
Etag: "3e1eecee8c3cd1:3b78f"
Server: Microsoft-IIS/6.0
X-Powered-By: ASP.NET

1.2)Etag响应头 和 If-None-Match请求头

Etag表明了文件的一种状态,当文件内容不变时,Etag也不变,反过来也是如此;如果文件内容变化时,Etag也应该发生变化。

Etag没有标准的生成方法,有的Web服务器采用“文件最后修改时间戳+文件长度”来作为Etag,有的可能以 md5摘要来作为Etag。

如果响应头中有 Etag,那么浏览器也会缓存起来。

再次访问该文件时,发出的请求会包含 If-None-Match请求头。

在前面的示例中其实已经有了Etag和If-None-Match的例子。

 

1.3)关于动态网页,比如 jsp/php/asp 等,不会自动生成 Last-Modified响应头,也不会自动生成 Etag响应头。

这个是程序员根据需要来实现的,如果动态内容不会经常变化,那就可以生成响应的 Last-Modified响应头 或者 Etag响应头。

 

2. 缓存截止期

2.1)Expires响应头

HTTP中,Expires响应头告诉浏览器该内容在何时过期,暗示浏览器在该内容过期之前不需要再询问服务器,而直接使用本地缓存即可。

 

Expires: Thu, 15 Nov 2012 09:12:19 GMT

 

要注意的是:Web服务器默认不会生成Expires响应头,即使是静态页面。不过,一般的Web服务器都可以进行配置,各种Web服务器的配置方式不尽相同。

另外,对于常见的静态文件格式,即使Web服务器返回的响应头中不包含Expires,浏览器也会默认一个过期时间。

比如,IE在某种缓存模式下,对于GIF文件设置为永不过期。

 

2.2)Cache-Control响应头

有一个问题,通过Expires指定的过期时间,是来自于Web服务器的系统时间,如果用户本地时间与服务器时间不一致,那么浏览器缓存的有效期检查就会受到影响。

幸运的是,在HTTP/1.1中有一个Cache-Control的响应头来弥补Expires的不足,形式如下:

Cache-Control: max-age=<second>

对于静态内容,Web服务器在开启Expires的同时,也会自动添加Cache-Control响应头。

那这样的话,Expires和Cache-Control都有的话,以哪个为准呢?

目前主流的浏览器都优先考虑 Cache-Control ,对于没有 Cache-Control 的,以 Expires 为准。

 

2.3)动态内容

需要程序员根据实际需要自行添加这几个响应头。

 

3. 在Java实现的Web Server中,动态内容添加处理缓存有关请求头和响应头

3.1)处理浏览器缓存的代码

下面的示意代码就展示了处理缓存的方式

    File f = new File(file);
    long lastModified = f.lastModified();    // 发现后面3位的毫秒数不为0
    
    long ifModifiedSince = request.getDateHeader("If-Modified-Since");    // 后面3位的毫秒数为0
    
    //response.setHeader("f1", Long.toString(lastModified));
    //response.setHeader("f2", Long.toString(ifModifiedSince));
    
    if (ifModifiedSince != -1) {
        // SC_NOT_MODIFIED 304
        if (lastModified / 1000L <= ifModifiedSince / 1000L) {
            response.setStatus(HttpServletResponse.SC_NOT_MODIFIED);
            response.setDateHeader("expires", System.currentTimeMillis()+1000*3600);
            response.setHeader("Cache-Control","max-age="+3600);
            //System.out.println("\n\n\n\n\n cache "+System.currentTimeMillis()+"**************************** \n\n\n\n\n");
            return ;
        }
    }
    
    //System.out.println("\n\n\n\n\n whole "+System.currentTimeMillis()+"**************************** \n\n\n\n\n");
    
    // 要把修改时间设置上
    response.setContentLength((int) f.length());
    response.setDateHeader("Last-Modified", lastModified);
    response.setDateHeader("expires", System.currentTimeMillis()+1000*3600);
    response.setHeader("Cache-Control","max-age="+3600);
    //out.print("");

3.2)如何测试?浏览器的三种刷新方式

使用 Firefox/FireBug, Chrome, HttpWatch 等工具跟踪 HTTP的请求和响应。

(1) 浏览器地址栏的“转到”或通过超链接跳转:如果已有缓存,会发送 If-Modified-Since 和 If-None-Match,并且 Expires 也有效;

(2) F5 一般刷新:会发送 If-Modified-Since 和 If-None-Match,但是 Expires 无效;

(3) Ctrl+F5 强制刷新:网页中所有内容(图片、js、css等)全部重新加载,不会发送 If-Modified-Since 和 If-None-Match。

本文来自:http://www.vktone.com/articles/http_browser_cache.html   (原文可能会更新,请感兴趣的朋友直接访问)

全文完。

6
2
分享到:
评论

相关推荐

    Loadrunner负载测试 浏览器缓存设置

    浏览器缓存是Web浏览过程中的一个重要部分,它存储了用户访问过的网页资源,如图片、JavaScript文件和CSS样式表等,以减少网络延迟,提升用户体验。在负载测试中,正确配置浏览器缓存能帮助我们更好地模拟真实的用户...

    浏览器缓存查看及恢复工具

    浏览器缓存是网络浏览的重要组成部分,它帮助用户快速加载先前访问过的网页,通过存储静态资源如图片、JavaScript和CSS文件,减少对服务器的请求。本文将深入探讨浏览器缓存的工作原理,以及如何使用“浏览器缓存...

    浅析http协议、cookies和session机制、浏览器缓存.docx

    本文将深入探讨HTTP协议的几个核心概念:HTTP头、Cookies、Session机制以及浏览器缓存。 首先,HTTP请求头和响应头是HTTP协议的重要组成部分,它们包含了关于请求和响应的元信息。在请求头中,例如`GET`方法、`Host...

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

    ### 浏览器缓存机制介绍与缓存策略剖析 浏览器缓存是前端性能优化的一个重要组成部分,其可以减少网络IO消耗,提高访问速度。浏览器缓存的机制可以分为四个方面:MemoryCache、ServiceWorkerCache、HTTPCache和...

    web浏览器-缓存详解

    本文将深入解析浏览器缓存的工作原理、类型、以及如何控制和利用缓存来优化网站性能。 一、浏览器缓存的原理 浏览器缓存(Browser Cache)是一种本地存储机制,它会保存用户访问过的网页资源(如HTML、CSS、...

    浅谈Ajax请求与浏览器缓存

    综合来看,要有效利用浏览器缓存,前端开发者不仅要合理设置Ajax请求中的cache属性,还需要理解和运用HTTP缓存控制机制,包括Cache-Control和Expires头的设置。通过合理配置这些设置,可以在确保用户体验的同时,...

    http缓存知识梳理

    浏览器缓存是HTTP协议的一部分,它的使用可以减少浏览器与服务器之间的通信次数,降低延迟,提升用户体验。使用浏览器缓存可以避免对服务器资源的重复加载,特别是对于大文件如图片、视频等资源,缓存的效果尤为明显...

    Http页面缓存机制(转)

    在浏览器与服务器之间的通信中,缓存扮演了中间者的角色,将频繁访问的数据暂存到本地,以便在后续请求时快速响应。 ### 1. 缓存的基本概念 缓存是一种存储技术,用于临时存储最近访问的数据,以便再次请求时快速...

    浏览器

    4. 浏览器缓存:为了提高加载速度,浏览器会将经常访问的资源存储在本地,如图片、CSS和JavaScript文件。 5. DNS解析:将网址转换为IP地址,以便找到目标服务器。 6. 安全机制:包括HTTPS加密、证书验证、沙箱环境...

    浏览器HTTP协议请求头信息.docx

    HTTP协议是互联网上应用最为广泛的一种网络通信协议,它定义了客户端(通常是浏览器)与服务器之间的通信格式。在HTTP通信中,请求头和响应头扮演着至关重要的角色,它们包含了客户端与服务器交互所需的关键信息。 ...

    浏览器的知识体系结构思维导图(PDF版)

    在这个过程中,JavaScript代码可能会阻塞渲染,特别是如果JavaScript代码放在标签中,会导致浏览器在执行脚本之前停止解析其余部分的DOM。为了避免这种情况,可以将JavaScript脚本放在标签的底部,并使用async和...

    认清http协议本质

    HTTP(Hypertext Transfer Protocol)超文本传输协议是互联网上应用最为广泛的一种网络协议,它定义了客户端(浏览器或其他HTTP客户端)和服务器之间交换数据的格式和行为。要认清HTTP协议的本质,我们需要从以下几...

    Web缓存技术概述.pdf

    Web缓存主要可以分为客户端缓存(浏览器缓存)和服务器端缓存(代理缓存)。客户端缓存存储在用户的设备上,如浏览器的缓存目录;服务器端缓存则通常由互联网服务提供商(ISP)或者企业使用,可以显著减少互联网核心...

    http协议中英文版

    HTTP(Hypertext Transfer Protocol)超文本传输协议是互联网上应用最为广泛的一种网络协议,它定义了客户端(如浏览器)和服务器之间交换数据的格式和行为。本篇将基于提供的标题和描述,深入探讨HTTP协议的基本...

    浏览器X的设计 浏览器的设计好书

    1. **用户界面(UI)**:这是用户与浏览器交互的部分,包括地址栏、前进/后退按钮、书签、下载管理器等。UI负责接收用户的输入并展示网页内容。 2. **浏览器引擎**:它负责协调UI与渲染引擎之间的通信,确保用户...

    面试中的HTTP协议

    - HTTPS:HTTP与SSL/TLS的结合,提供了数据加密、服务器身份验证、消息完整性检查,确保通信安全。 7. **首部字段**: - 常见的有Content-Type定义数据类型,Authorization进行身份验证,Cookie和Set-Cookie管理...

    网页视频缓存提取器

    当浏览器缓存了视频数据,即使在没有网络连接的情况下,用户也可能能观看部分或完整的视频,但这依赖于缓存的数据量。 "网页视频缓存提取器"的工作原理是扫描浏览器的缓存目录,查找并识别出视频文件的残留数据。这...

Global site tag (gtag.js) - Google Analytics