浏览器: F5和 Ctrl+F5的区别

刚修改了所有的首页，全部加上了帮助firefox来创造世界奇迹！

不过现在有个问题，好几个首页必须按下ctrl+f5才能看到最新的效果。网上找了一片说f5和ctrl+f5区别的文章，写的很全面。

引:http://morganchengmo.spaces.live.com/blog/cns!9950CE918939932E!2144.entry

Browser: F5 vs Ctrl+F5

在浏览器里中，按F5键或者点击Toobar上的Refresh/Reload图标(简称F5)，和做F5同时按住Ctrl键（简称Ctrl+F5），效果是明显不一样的，通常Ctrl+F5明显要让网页Refresh慢一些，到底两者有什么区别呢？

在上一篇技术文章中，说到了Expires、Last-Modified/If-Modified-Since和ETag/If-None-Match这些HTTP Headers，F5/Ctrl+F5和这些有莫大关系。

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

Expires: Thu 27 Nov 2008 07:00:00 GMT
Last-Modified: Fri 30 Nov 2007 00:00:00 GMT

那么浏览器就会cache住这个logo.gif文件，直到2008年11月27日7点整，或者直到用户有意清空cache。

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

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

If-Modified-Since: Fri 30 Nov 2007 00:00:00 GMT

实际上Server没有修改这个logo.gif文件，所以返回一个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，而是把整个资源原原本本地返回一份，这样，Ctrl+F5引发的传输时间变长了，自然网页Refresh的也慢一些。

实际上，为了保证拿到的是从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对这个请求失效，这样返回的绝对是新鲜的资源

浏览器: F5和 Ctrl+F5的区别相关推荐

【前端指南】f5与ctrl+f5的区别
文章目录 f5和ctrl+f5 f5 ctrl+f5 f5与ctrl+f5的区别 f5 ctrl+f5 缓存缓存优点缓存协商和彻底缓存 f5和ctrl+f5 f5 第一次打开某网页,全部资源从服务 ...
在浏览器地址栏按回车、F5、Ctrl+F5刷新网页的区别--转
其中,在地址栏按回车又分为两种情况.一是请求的URI在浏览器缓存中未过期,此时,使用Firefox的firebug插件在浏览器里显示的HTTP请求消息头如下: Host 192.168.3.17 ...
在浏览器地址栏按回车、F5、Ctrl+F5刷新网页的区别
转自:http://blog.csdn.net/zoohouse/article/details/7552594 概述: "刷新"是在你现有页面的基础上,检查网页是否有更新的内容. ...
ASP.NET项目在VS中F5与Ctrl+F5的区别
场景 ASP.NET中MVC编程模式简介与搭建HelloWorld项目: https://blog.csdn.net/BADAO_LIUMANG_QIZHI/article/details/10679 ...
F5与Ctrl+F5及地址栏输入地址回车
按F5等同于点击页面地址栏的刷新图标. 地址栏输入地址然后回车: 根据缓存内容是否过期决定是否发送请求给服务端 F5: 浏览器无论如何都得发送请求给服务端,包含If-Modified-Since/If ...
网页中F5刷新与ctrl + F5强制刷新的区别？
目录: 一:F5刷新二.ctrl + F5 刷新三. 这两个的区别很大! 四.总结五.系列文章目录 F5-刷新只是刷新一次当前页面的资源,使用F5刷新,浏览器仍然会重复利用之前的缓存数据. ...
火狐浏览器刷新ctrl+F5
火狐浏览器刷新ctrl+F5 转载于:https://www.cnblogs.com/nimezi/p/4334740.html
Ctrl+F5和F5区别
F5刷新的内容是从本地缓存中读取刷新,刷新本地缓存 Ctrl+F5直接读取服务器上的最新的内容-- Ctrl+F5会把Internet 临时文件夹的文件删除再重新从服务器下载,也就是彻底刷新页面了.. ...
浏览器强制刷新快捷键 ctrl+F5
强制刷新 ctrl+F5 转载于:https://www.cnblogs.com/phper-martin/p/3461528.html

浏览器: F5和 Ctrl+F5的区别

浏览器: F5和 Ctrl+F5的区别相关推荐

最新文章

热门文章