浏览器中F5和CTRL F5的行为区别及如何强制更新资源
一、浏览器中F5和CTRL F5的行为区别
我们直接来看效果，下面是我打开qq网页，分别使用F5和CTRL F5，我们来看区别。
F5:
CTRL F5:
区别：
首先直观上的区别是CTRL F5明显比F5加载速度慢了。观察资源加载发现，F5中大部分资源的状态码都是304，也就是重定向，使用了很多缓存资源；而CTRL F5中所有资源状态码都是200，都是重新下载了资源。
1.F5使用缓存，并且只有在资源内容发生变化的时候才会去更新资源
当刷新一个页面的时候，浏览器会尝试使用各种类型的缓存，并且会发送If-Modified-Since头到服务器，如果服务器返回304 Not Modified，那么浏览器会使用本地的缓存；如果服务器返回200 OK和资源内容，那么浏览器会使用返回的资源内容，并把资源内容进行缓存，待下次使用。
注：刷新页面，会让浏览器向服务端发起验证，忽略 max-age。
2.CTRL-F5 强制更新页面资源的缓存
MSIE会发送Cache-Control: no-cache头，Firefox和Chrome除了发送Cache-Control: no-cache头之外，还会发送Pragma: no-cache头。Opera比较另类，不发送任何和缓存相关的头。
二、如何强制更新资源
1.加上请求头If-Modified-Since和Cache-Control
下面我们来看CTRL F5是如何做到强制更新资源而不适用缓存的。
我们看上面例子如何做到的
我们发现http请求头中多了cache-control:no-control;如果服务器响应头中规定了Last-Modified，我们还需要在http头部加上If-Modified-Since：0。
在ajax中可以使用setRequestHeader()方法。
注：no-cache 并不是说「不缓存」，它意味着使用缓存前必须检查（或者说验证）这个资源在服务端是否有更新。no-store 用来告知浏览器完全不要缓存这个资源。类似的，must-revalidate 并不是说「每次都要验证」，它意味着某个资源在本地已缓存时长短于 max-age 指定时长时，可以直接使用，否则就要发起验证。
2.meta方法
<META HTTP-EQUIV="pragma" CONTENT="no-cache">
<META HTTP-EQUIV="Cache-Control" CONTENT="no-cache, must-revalidate">
<META HTTP-EQUIV="expires" CONTENT="0">
3.清理form表单的临时缓存
<body onLoad="javascript:document.yourFormName.reset()">
其实form表单的缓存对于我们书写还是有帮助的，一般情况不建议清理，但是有时候为了安全问题等，需要清理一下！
4.随机数或者随机时间
URL 参数后加上 "?ran=" + Math.random(); //当然这里参数 ran可以任意取了
在 URL 参数后加上 "?timestamp=" + new Date().getTime();
参考资料：http://weizhifeng.net/difference-between-f5-and-ctrl-f5.html
http://www.haorooms.com/post/js_llq_hc
浏览器中F5和CTRL F5的行为区别及如何强制更新资源的更多相关文章
- 浏览器缓存如何控制？ && 在url框中回车、F5 和 Ctrl + F5的区别是什么？
第一部分: 浏览器缓存如何控制? 最近在做网站,但是不知道缓存是什么东西怎么能行! 如何实现HTTP缓存呢? 下面我们来一步一步的探寻实现机制把. 方案一: 无缓存 说明: 浏览器向服务器请求 ...
- 浏览器缓存控制 以及 在url框中回车、F5 和 Ctrl + F5的区别
第一部分: 浏览器缓存如何控制? 做网站,不知道缓存是什么东西怎么能行! 如何实现HTTP缓存呢? 下面我们来一步一步的探寻实现机制把. 方案一: 无缓存 说明:浏览器向服务器请求资源m.pn ...
- [转帖]浏览器的F5和Ctrl+F5
浏览器的F5和Ctrl+F5 https://www.cnblogs.com/xiangcode/p/5369084.html 在浏览器里中,按F5键和按F5同时按住Ctrl键(简称Ctrl+F5), ...
- 改变浏览器中默认的ctrl+s方法
在一般的情况下,我们在浏览网页的时候按下ctrl+s,浏览器会弹出一个保存网页的框. 但是在一些特定的网页中,我们希望ctrl+s不是弹出默认的保存窗口,而是进行一下别的操作. 比如在我们使用简书的时 ...
- 浏览器中F5和CTRL F5的行为区别
前言 在印象中,浏览器中的F5和刷新按钮是一样的效果,都是对当前页面进行刷新:Ctrl-F5的行为也是刷新页面,但是会清除浏览器缓存,这在前端调试时候会常用.二者真正的区别是什么呢?在stackove ...
- 【转】浏览器中F5和CTRL F5的行为区别
原文地址:http://www.cnblogs.com/jiji262/p/3410518.html 前言 在印象中,浏览器中的F5和刷新按钮是一样的效果,都是对当前页面进行刷新:Ctrl-F5的行为 ...
- 在浏览器地址栏按回车、F5、Ctrl+F5刷新网页的区别
不少同学问,不都是刷新吗?还有什么区别?其实,还是有的. 其中,在地址栏按回车又分为两种情况.一是请求的URI在浏览器缓存中未过期,此时,使用Firefox的firebug插件在浏览器里显示的HTTP ...
- 转：在浏览器地址栏按回车、F5、Ctrl+F5刷新网页的区别
转:http://www.cnblogs.com/mofish/archive/2012/06/08/2541604.html 不少同学问,不都是刷新吗?还有什么区别?其实,还是有的. 其中,在地址栏 ...
- 在浏览器地址栏按回车、F5、Ctrl+F5刷新网页的区别--转
其中,在地址栏按回车又分为两种情况.一是请求的URI在浏览器缓存中未过期,此时,使用Firefox的firebug插件在浏览器里显示的HTTP请求消息头如下: Host 192.168.3.17 ...
随机推荐
- git 版本库拆分和subtree用法
git 版本库拆分 原文地址: https://segmentfault.com/a/1190000002548731 程序员最爽的事情是什么?删删删!所有项目本来都很苗条的,时间长了难免有一些越搞越 ...
- 开机logo以及两种修改开机动画方法
Android开机画面总共有三屏 一.第一屏:开机logo 1.选张png格式的图片,在Linux任意下执行(安装工具): sudo apt-get install pnmtoplainpm 2.在所 ...
- 21069207《Linux内核原理与分析》第四周作业
本周首先我结合mooc网的视频资料,了解了计算机的三大法宝,分别是存储程序计算机,函数调用堆栈和中断机制. 在计算机的三大法宝中,存储程序计算机是根本,函数调用堆栈是高级语言运行的基础,而中断机制成就 ...
- CentOS 5.8下快速搭建FTP服务器
学习安装和配置vsftpd: 实验环境:CentOS 5.8 x86_64 测试环境关掉防火墙和selinux. service iptables stop setenforce 0 1.安装vsft ...
- POJ3255-Roadblocks(最短路)
Description Bessie has moved to a small farm and sometimes enjoys returning to visit one of her best ...
- 在Ubuntu上安装pyenv
因为找到一个域名枚举的脚本使用Python3编写的,而我一直习惯的是使用Python2.7,在自己的Windows7上再安装个Python怕混了,于是想着在VPS上装个Python的版本管理工具,也方 ...
- Javaweb异常提示信息统一处理
Java异常封装(自己定义错误码和描述,附源码) 2016年01月29日 22:30:54 小宝鸽 阅读数:23262 标签: java异常 更多 个人分类: Java基础 所属专栏: Java工作实 ...
- ASP.NET Web API 框架研究 ASP.NET 路由
ASP.NET Web API 如果采用Web Host方式来寄宿,在请求进入Web API 消息处理管道之前,就会用ASP.NET 自身的路由系统根据注册的路由表,解析出当前请求的HttpContr ...
- 11i - 12 Gather Schema Statistics fails with Ora-20001 errors after 11G database Upgrade (文档 ID 781813.1)
11i - 12 Gather Schema Statistics fails with Ora-20001 errors after 11G database Upgrade (文档 ID 7818 ...
- 8.ajax与django后台json数据的交互
1新建django项目名为json_ajax,应用名为app,在templates模板中新建ajax.html文件 ajax.html <!DOCTYPE html> <html l ...