浏览器的F5和Ctrl+F5

在浏览器里中,按F5键和按F5同时按住Ctrl键(简称Ctrl+F5),效果是不同,到底两者有什么区别呢?

假如我第一次访问过http://localhost/home,这个网页是个动态网页,每次访问都会去访问Server,但是它包含一个一个静态资源http://localhost/content/bootstrap.css,浏览器在显示这个网页之前需要发HTTP请求获取这个bootstrap.css文件,返回的HTTP response包含这样的Headers:

下次我再通过bookmark或者通过在URI输入栏直接敲字的方法访问http://localhost/home的时候,浏览器一看本地有个bootstrap.css,而且它还没过期呢,就不会发HTTP request给server,而是直接把本地cache中的bootstrap.css显示了。

F5的作用和直接在URI输入栏中输入然后回车是不一样的,F5会让浏览器无论如何都发一个HTTP Request给Server,即使先前的Response中有Expires Header。所以,当我在当前http://localhost/home网页中按F5的时候,浏览器会发送一个HTTP Request给Server,但是包含这样的Headers:

If-Modified-Since: Wed, 20 Jan 2016 10:24:40 GMT

实际上Server没有修改这个bootstrap.css文件,所以返回一个304 (Not Modified),这样的Response很小,所以round-trip耗时不多,网页很快就刷新了。

上面的例子中没有考虑ETag,如同在上一篇技术文章中所说,最好就不要用ETag,但是如果Response中包含ETag,F5引发的Http Request中也是会包含If-None-Match的。

那么Ctrl+F5呢? Ctrl+F5要的是彻底的从Server拿一份新的资源过来,所以不光要发送HTTP request给Server,而且这个请求里面连If-Modified-Since/If-None-Match都没有,这样就逼着Server不能返回304,而是把整个资源原原本本地返回一份。

实际上,为了保证拿到的是从Server上最新的,Ctrl+F5不只是去掉了If-Modified-Since/If-None-Match,还需要添加一些HTTP Headers。按照HTTP/1.1协议,Cache不光只是存在Browser终端,从Browser到Server之间的中间节点(比如Proxy)也可能扮演Cache的作用,为了防止获得的只是这些中间节点的Cache,需要告诉他们,别用自己的Cache敷衍我,往Upstream的节点要一个最新的copy吧。

在IE6中,Ctrl+F5会添加一个Header

Pragma: no-cache

在Firefox 2.0中,Ctrl+F5会添加两个 
Pragma: no-cache 
Cache-Control: max-age=0

作用就是让中间的Cache对这个请求失效,这样返回的绝对是新鲜的资源

Cache-Control max-age=0

Cache-Control  no-cache — 强制每次请求直接发送给源服务器,而不经过本地缓存版本的校验。这对于需要确认认证应用很有用(可以和public结合使用),或者严格要求使用最新数据 的应用(不惜牺牲使用缓存的所有好处) 
Pragma 当"no-cache"出现在请求消息中时,应用程序应当向原始服务器推送此请求,即使它已 
经在上次请求时已经缓存了一份拷贝。这样将保证客户端能接收到最权威的回应。它也用来 
在客户端发现其缓存中拷贝不可用或过期时,对拷贝进行强制刷新。 
cache-control 
max-age>0 时 直接从游览器缓存中 提取 
max-age<=0 时 向server 发送http 请求确认 ,该资源是否有修改 
有的话 返回200 ,无的话 返回304.

时间: 2024-10-18 09:22:21

浏览器的F5和Ctrl+F5的相关文章

在浏览器地址栏按回车、F5、Ctrl+F5刷新网页的区别--转

其中,在地址栏按回车又分为两种情况.一是请求的URI在浏览器缓存中未过期,此时,使用Firefox的firebug插件在浏览器里显示的HTTP请求消息头如下: Host    192.168.3.174:8080User-Agent    Mozilla/5.0 (Windows NT 5.1; rv:5.0) Gecko/20100101 Firefox/5.0Accept    text/html,application/xhtml+xml,application/xml;q=0.9,*/*

在浏览器地址栏按回车、F5、Ctrl+F5刷新网页的区别

转自:http://blog.csdn.net/zoohouse/article/details/7552594 先来说"刷新",它是在你现有页面的基础上,检查网页是否有更新的内容.在检查时,会保留之前的一些变量的值,因此有可能会造成刷新后网页出现错误,或者打不开的情况:"转到"和在地址栏回车,则相当于你重新输入网页的URL访问,这种情况下,浏览器会尽量使用已经存在于本机中的缓存.也就是说,"刷新" 是取网页的新内容来更新本机缓存,在更新的同时保

在浏览器地址栏按回车、F5、ctrl+F5刷新页面的区别

url地址栏里敲击enter:这样的刷新,大家可以在firebug里看一下,只有少数的请求会发送出去,而且几乎没有图片的请求,这是因为请求时会先检查本地是不是缓存了请求的图片,如果有缓存而且没有过期(过期可以通过该图片请求的header查看),他就不会发出这个图片request. f5:f5刷新比enter略慢,为什么呢,因为他还是把所有请求都发给了server,只是在request里的header里有信息 Expires Fri, 28 Jun 2013 07:29:55 GMT Last-M

刷新快捷键F5和Ctrl+F5的区别

魅力经常要刷新网页,原来只是按f5发现有时能更新有时不行,后来听人说直接按ctrl+f5就可以直接一下子更新,试了一下 果然很神奇 直接就刷新了 不再有缓存 具体区别是:F5通常只是刷新本地缓存:Ctrl+F5可以把INTERNET临时文件夹的文件删除再重新从服务器下载,也就是彻底刷新页面了 大家在刷新浏览器的时候,不妨试试ctrl+f5 能实时更新. 原文地址:http://blog.51cto.com/hmlwl/2114256

Vs2013在Linux开发中的应用(34):Ctrl + F5支持

快乐虾 http://blog.csdn.net/lights_joy/ 欢迎转载,但请保留作者信息 VS中常用的Ctrl+F5可以不调试直接运行,但是其运行的环境变量仍然可以传递给应用程序,在我们的调试方案中使用了一个叫RemoteConsole的stub程序 在调试状态下,EmbedLinux调试引擎会在开始调试时打开一个自动选择的服务端口,再将此端口号通过环境变量传递给RemoteConsole. 在直接运行的情况下,RemoteConsole将由VS自动加载,此时由于没有调试引擎,也就没

Ctrl+F5和F5区别

F5刷新的内容是从本地缓存中读取刷新,刷新本地缓存 Ctrl+F5直接读取服务器上的最新的内容-- Ctrl+F5会把Internet 临时文件夹的文件删除再重新从服务器下载,也就是彻底刷新页面了.. 所以:测试H5的时候要经常Ctrl+F5

解决vs2010按ctrl+f5,调试窗口一闪而过的方法

vs2010调试按F5与按Ctrl+F5有什么区别 Ctrl F5测试运行后不自动推出控制台,直接按F5会自动退出去 解决vs2010按ctrl+f5,调试窗口一闪而过的方法 http://hi.baidu.com/hello_guan/item/c41603cd6f36cec7994aa0a1 打开一个解决方案 找到[解决方案资源管理器]窗口,右键项目名称-属性 在打开的窗口中选择 配置属性>链接器>系统>子系统中选择[控制台]即可,然后确定保存. 原文地址:https://www.c

谷歌和火狐清楚浏览器缓存的快捷键???shift+ctrl+delete

今天老大,git使用过程中出现问题,老大过来调试的时候,清楚浏览器缓存不用鼠标用的是快捷键,有时候ctrl+f5刷新不管用,怀疑是缓存的原因的时候就要清楚浏览器的缓存. 再问,f5 和ctrl+f5有啥区别??具体有啥区别,也看了博客园其他的相关的博客,讲的有点深奥.暂且不说··· 总之 f5,ctrl+f5,shift+ctrl+delete 可以解决有时候这个浏览器好,那个浏览器不好的bug····

浏览器缓存机制-社招必问知识

浏览器缓存总共有5个方法: 1.Pragma关键字,这是非HTTP协议定义的缓存机制,使用HTML Meta 标签,Web开发者可以在HTML页面的<head>节点中加入<meta>标签,代码如下: <META HTTP-EQUIV="Pragma" CONTENT="no-cache"> 上述代码的作用是告诉浏览器当前页面不被缓存,每次访问都需要去服务器拉取.使用上很简单,但只有部分浏览器可以支持,而且所有缓存代理服务器都不支持