图片缓存:浏览器刷新 和 304 Not Modified 与 If-Modified-Since 及 Cache-Control

关键词:浏览器刷新,304 Not Modified ,If-Modified-Since,Cache-Control,Expires

今天在用chrome浏览淘宝页面的时候,发现很多来自淘宝图片HTTP状态码是 304 Not Modified

到百度搜索了一下,明白了 304状态的含义(以下绿色内容来自网络):

304 Not Modified:客户端有缓冲的文件并发出了一个条件性的请求(一般是提供If-Modified-Since头表示客户只想比指定日期更新的文档)。服务器告诉客户,原来缓冲的文档还可以继续使用。

如果客户端在请求一个文件的时候,发现自己缓存的文件有 Last Modified ,那么在请求中会包含 If Modified Since ,这个时间就是缓存文件的 Last Modified 。因此,如果请求中包含 If Modified Since,就说明已经有缓存在客户端。只要判断这个时间和当前请求的文件的修改时间就可以确定是返回 304 还是 200 。对于静态文件,例如:CSS、图片,服务器会自动完成 Last Modified 和 If Modified Since 的比较,完成缓存或者更新。但是对于动态页面,就是动态产生的页面,往往没有包含 Last Modified 信息,这样浏览器、网关等都不会做缓存,也就是在每次请求的时候都完成一个 200 的请求。

我突然想起我所写的图片服务器没有实现HTTP 304 缓存功能。

这个 304 状态一般主要在用户刷新页面(F5键)的时候触发,当用户在刷新页面的时候,因为原来的页面里的很多图片已经缓存过,客户端的浏览器已经记录了图片的最后更新时间(Last Mod),所以在用户刷新页面的时候,会向服务器提交一个字段:If-Modified-Since: Wed, 08 Sep 2010 21:35:06 GMT

这个时候,服务器端的程序先取得这个字段的值,然后与服务器上的图片最后修改时间对比,如果相同,就直接返回 304 Not Modified ,然后停止。这样就不用把图片重新传输到客户端,达到节省带宽的目的。

关于 Cache-Control: max-age=秒 和 Expires

Expires = 时间,HTTP 1.0 版本,缓存的载止时间,允许客户端在这个时间之前不去检查(发请求)
max-age = 秒,HTTP 1.1版本,资源在本地缓存多少秒。
如果max-age和同时存在,则被Cache-Control的max-age覆盖。

Expires 的一个缺点就是,返回的到期时间是服务器端的时间,这样存在一个问题,如果客户端的时间与服务器的时间相差很大,那么误差就很大,所以在HTTP 1.1版开始,使用Cache-Control: max-age=秒替代。

今天我还发现一个小的问题,是关于客户端的日期格式:

Wed, 08 Sep 2010 21:35:06 GMT 与 Wed, 8 Sep 2010 21:35:06 GMT

注意上面的格式,一个是8的前面有个前置的0,一个没有。

我发现firefox和chrome对这个日期格式处理一致,ie有点不同。
最终我修改了服务器端的程序:
//HTTP 日期格式: Wed, 08 Sep 2010 21:35:06 GMT
DateFormat dateFormatGMT = new SimpleDateFormat("EEE, dd MMM yyyy HH:mm:ss z", Locale.ENGLISH); //时间格式

2010-11-07

时间: 2024-10-14 01:56:00

图片缓存:浏览器刷新 和 304 Not Modified 与 If-Modified-Since 及 Cache-Control的相关文章

Ajax清除浏览器js、css、图片缓存的方法

做东东时都是把图片在服务器的地址存放在数据库里面,然后到浏览器中显示,但是后来发现了两个问题. 第一:为了安全起见,js是无法读取本地的图片的,不然你写一个js,岂不是可以获取任何人电脑里面的文件了. 第二:图片存在的是在服务器的硬盘上面,而不是在客户的硬盘里面,所以也是取不到的 后来在网上找方法,找的方法,都是各种转换二进制到xml中,的各种高大上的答案,然后本人又实在太懒了,就自己想了一个 方法,就是利用BufferedImage这个类. 开始 首先说说我的思路,就是把本地的图片,加载到内存

nginx js和jpg图片缓存

nginx js和jpg图片缓存设置 listen       80; server_name  xxxxx; index index.htm index.html; root  /to/path/; location ~ .*\.(js|css)?$ { expires 5d; } location ~ .*\.(gif|jpg|jpeg|png|bmp|swf)$ { expires 30d; valid_referers none blocked www.xxxx *.xxxxxx; if

Android公共库——图片缓存 网络缓存 下拉及底部更多ListView 公共类

Android公共库--图片缓存 网络缓存 下拉及底部更多ListView 公共类 转载自http://www.trinea.cn/android/android-common-lib/ 介绍总结的一些android公共库,包含缓存(图片缓存.预取缓存.网络缓存).公共View(下拉及底部加载更多ListView.底部加载更多ScrollView.滑动一页Gallery).及Android常用工具类(网络.下载.shell.文件.json等等). TrineaAndroidCommon已开源,地

Android探索之图片缓存<Glide进阶>(四)

前言: 前面学习了Glide的简单使用(http://www.cnblogs.com/whoislcj/p/5558168.html),今天来学习一下Glide稍微复杂一点的使用. GlideModule使用: GlideModule 是一个抽象方法,全局改变 Glide 行为的一个方式,通过全局GlideModule 配置Glide,用GlideBuilder设置选项,用Glide注册ModelLoader等. 1.)自定义一个GlideModule public class MyGlideM

【iOS】网络加载图片缓存与SDWebImage

加载网络图片可以说是网络应用中必备的.如果单纯的去下载图片,而不去做多线程.缓存等技术去优化,加载图片时的效果与用户体验就会很差. 一.自己实现加载图片的方法 tips: *iOS中所有网络访问都是异步的.(自己开线程去下载) *普通为模型增加UIImage属性的方法做的是内存缓存(下次启动还需要从网络重新加载), 而要做本地缓存的话,还要自己手动存储网络上下载的图片. *为了加快访问, 还需要自己去弄缓存.(内存缓存或者本地缓存) *当图片没有下载完成时,还要设置占位图片. 以下代码用NSOp

用nginx图片缓存服务器

用nginx图片缓存服务器 图片的存储硬件 把图片存储到什么介质上? 如果有足够的资金购买专用的图片服务器硬件或者 NAS 设备,那么简单的很: 如果上述条件不具备,只想在普通的硬盘上存储,首先还是要考虑一下物理硬盘的实际处理能力.是 7200 转的还是 15000 转的,实际表现差别就很大.是选择 ReiserFS 还是 Ext3 ,怎么也要测试一下吧? 创建文件系统的时候 Inode 问题也要加以考虑,选择合适大小的 inode size ,在空间和速度上做取舍,同时防患于未然,注意单个文件

清除图片缓存

?- (void)setupGroup1 { // 1.创建组 LKCommonGroup *group = [LKCommonGroup group]; [self.groups addObject:group]; // 2.设置组的所有行数据 LKCommonArrowItem *clearCache = [LKCommonArrowItem itemWithTitle:@"清除图片缓存"]; // 设置缓存的大小 //    NSString *caches = [NSSearc

SDWebImage的改版后的使用-图片缓存处理

我之前写过一篇博客,介绍缓存处理的三种方式,其中最难,最麻烦,最占内存资源的还是图片缓存,最近做的项目有大量的图片处理,还是采用了SDWebImage来处理,但是发现之前封装好的代码报错了.研究发现,是我用了新版的SDWebImage,好多方法都变了. 现在把代码贴出来,供大家参考.尤其是新手,看完这篇博客,图片缓存so easy.最后有demo供大家下载,先学习. 第一步,下载SDWebImage,导入工程.github托管地址https://github.com/rs/SDWebImage

Nginx 1.4.7图片缓存服务器

软件包版本: Nginx 1.4.7 Ngx_cache_purge-2.0 Openssl-1.0.1 Pcre-8.32 二.安装编译: a)         下载pcre-8.32.tar.gz      tar zvxf pcre-8.32.tar.gzcd pcre-8.32 && ./configure && make && make install b)         下载openssl-1.0.1.tar.gzcd openssl &