在开发一个网站功能时，由于session 缓存不能及时清除。开始了一系列的探索。
现找到几篇不错的文章。
首先是 F5和 CTRL+F5的区别
F5和CTRL+F5的区别背景
我司的网站是框架结构的,一个页面里有多个iframe.正因为这个原因,每次当我自信满满的把修改过的JS文件提交到SVN上后,没过多久,某个 后台程序员就会来找我说:怎么JS还报错呢,我已经CTRL+F5了啊,你提交对了吗.我只好到他座位上拿起鼠标进行操作:右键->本帧-> 在新标签中打开新帧->CTRL+F5->切换到原标签->F5.这一番操作之后,终于对了.同样的事情已经发生过很多次了.这也证明 了不少程序员同志还是不够了解浏览器的缓存机制.
基础知识
问题的根本原因就是,在火狐里,CTRL+F5清除不了框架页面的缓存.包括框架页面本身和其所有的嵌入元素(.js,.css,.jpg等).所以本文的真正标题是"Firefox中如何才能跳过缓存刷新框架内的页面".首先我要讲一下相关的基础知识.
一.读取缓存
搞WEB开发的经常会说:有缓存,CTRL+F5一下.或者:有缓存,CTRL+SHIFT+DEL清一下.那么你知道浏览器有几种方式来读取缓存文件吗.从是否发送了HTTP请求来区分,我觉的可以分两种:
1.浏览器从服务器返回的过期时间判断得出,该文件还没有过期,所以直接从缓存文件夹读取缓存文件,显示网页,并没有走任何网络连接.
2.浏览器发送HTTP请求,请求头中包含了If-Modified-Since 和 If-None-Match字段.让服务器来判断是否应该读取缓存文件.如果服务器返回304响应,无响应实体,表示服务器认为这个文件没有变化.可以使 用缓存中的对应文件,这时浏览器才会读取缓存.(如果不了解HTTP,可以买本<<HTTP权威指南>>看看.或者直接RFC2616)
我把第一种读取缓存的方式称之为"无请求读取缓存",第二种方式称之为"无修改读取缓存".
二.刷新方式
这里的刷新方式是指能通过哪些方式让一个网页重新加载,我从表现上大概分了三种:
1.最常用的,点击浏览器的刷新按钮,或者按下F5
2.CTRL+F5,功能是跳过缓存刷新
3.浏览器地址栏上回车,IE里把这种请求方式归为"导航"操作
在读取缓存方面,这三种刷新方式的表现都不一样.第三种方式的表现通常是只刷新主页面文件,其他内嵌文件全部"无请求读取缓存".大部分开发者都不会这么刷新页面,所以本次试验不对比这种刷新方式.
三.F5和CTRL+F5的区别
本文的试验部分只针对F5和CTRL+F5两种刷新方式做对比.这里讲一下为什么F5不能跳过缓存,而后者可以.答案就是发送的请求头不一样.而且不同的浏览器发送的请求头也有一些区别.
1.F5触发的HTTP请求的请求头中通常包含了If-Modified-Since 或 If-None-Match字段,或者两者兼有.如果服务器认为被请求的文件没有发生变化,则返回304响应,也就没有跳过缓存.
2.CTRL+F5触发的HTTP请求的请求头中没有上面的那两个头,却有Pragma: no-cache 或 Cache-Control: no-cache 字段,或者两者兼有.服务器看到no-cache这样的值就会把最新的文件响应过去.也就跳过了缓存.
试验对比
试验题目为:使用F5和CTRL+F5在包含iframe的页面上进行刷新操作,五大浏览器各自的表现不同.本次试验使用Fiddler监测网络请求,而且不考虑缓存相关的HTTP响应头的影响.
主页面index.html源码为
新闻热点
疑难解答
