在 Web 浏览器中触发哪些操作 F5 和 Ctrl+F5 是否有标准?
我曾经在 IE6 和 Firefox 2.x 中做过实验。 F5 刷新会触发带有 If-Modified-Since
标头的 HTTP 请求发送到服务器,而 Ctrl+F5 不会有这样的标头.在我的理解中,F5 会尽量利用缓存的内容,而 Ctrl+F5 的目的是放弃所有缓存的内容,只再次从服务器检索所有内容。
但是今天,我注意到在一些最新的浏览器(Chrome、IE8)中,它不再以这种方式工作了。 F5 和 Ctrl+F5 都发送 If-Modified-Since
标头。
那么这应该如何工作,或者(如果没有标准)主要浏览器在实现这些刷新功能方面有何不同?
ALT+F5
与 CTRL+F5
的作用相同。
这取决于浏览器,但它们的行为方式相似。
F5 通常只有在页面被修改时才会更新页面。现代浏览器发送 Cache-Control: max-age=0
告诉任何缓存资源被认为是新鲜的最长时间,相对于请求的时间。
CTRL-F5 用于强制更新,忽略任何缓存。现代浏览器发送 Cache-Control: no-cache
和 Pragma: No-cache
如果我没记错的话,Netscape 是第一个通过在按下 CTRL-F5 时添加 Pragma: No-cache
来支持缓存控制的浏览器。
┌───────────┬──────────────┬─────┬─────────────────┬──────────────────────────────┐
│ Version 4 │ F5 │ R │ CLICK │ Legend: │
│2021 MAY 19├──┬──┬──┬──┬──┼──┬──┼──┬──┬──┬──┬──┬──┤ C = Cache-Control: no-cache │
│ │ │S │C │A │A │C │C │ │S │C │A │A │C │ I = If-Modified-Since │
│ │ │H │T │L │L │T │T │ │H │T │L │L │T │ M = Cache-Control: max-age=0 │
│ │ │I │R │T │T │R │R │ │I │R │T │T │R │ N = Not tested │
│ │ │F │L │ │G │L │L │ │F │L │ │G │L │ P = Pragma: No-cache │
│ │ │T │ │ │R │ │+ │ │T │ │ │R │+ │ - = ignored │
│ │ │ │ │ │ │ │S │ │ │ │ │ │S │ │
│ │ │ │ │ │ │ │H │ │ │ │ │ │H │ With 'CLICK' I refer to a │
│ │ │ │ │ │ │ │I │ │ │ │ │ │I │ mouse click on the browsers │
│ │ │ │ │ │ │ │F │ │ │ │ │ │F │ refresh-icon. │
│ │ │ │ │ │ │ │T │ │ │ │ │ │T │ │
│ │ │ │ │ │ │ │ │ │ │ │ │ │ │ 1: Version 3.0.6 sends I │
├───────────┼──┼──┼──┼──┼──┼──┼──┼──┼──┼──┼──┼──┼──┤ and C, but 3.1.6 opens │
│Brave 1.24 │M │CP│CP│- │- │M │CP│M │CP│CP│M │CP│CP│ the page in a new tab, │
├───────────┼──┼──┼──┼──┼──┼──┼──┼──┼──┼──┼──┼──┼──┤ making a normal request │
│Chrome 1 │MI│MI│MI│- │- │MI│- │MI│MI│MI│MI│MI│N │ with only I. │
│Chrome 6 │MI│CP│CP│- │- │MI│CP│MI│CP│CP│MI│- │N │ 2: Version 10.62 does │
│Chrome 90 │M │CP│CP│- │- │M │CP│M │CP│CP│M │CP│CP│ nothing. 9.61 might do C │
├───────────┼──┼──┼──┼──┼──┼──┼──┼──┼──┼──┼──┼──┼──┤ unless it was a typo in │
│Edge 90 │M │CP│CP│- │- │M │CP│M │CP│CP│M │CP│CP│ my old table. │
├───────────┼──┼──┼──┼──┼──┼──┼──┼──┼──┼──┼──┼──┼──┤ 3: Opens the currernt tab in │
│Firefox 3.x│MI│- │CP│- │- │MI│CP│MI│CP│1 │M │MI│N │ a new tab, but does not │
│Firefox 89 │M │- │CP│- │M │M │CP│M │CP│3 │M │M │3 │ refresh the page if it is │
├───────────┼──┼──┼──┼──┼──┼──┼──┼──┼──┼──┼──┼──┼──┤ cached in the browser. │
│MSIE 8, 7 │I │- │C │- │I │I │ │I │I │C │I │I │N │ │
├───────────┼──┼──┼──┼──┼──┼──┼──┼──┼──┼──┼──┼──┼──┤ │
│Opera 10, 9│C │- │- │2 │- │C │- │C │C │C │C │- │N │ │
│Opera 76 │M │CP│CP│- │- │M │- │M │CP│CP│M │CP│CP│ │
├───────────┴──┴──┴──┴──┴──┴──┴──┴──┴──┴──┴──┴──┴──┴──────────────────────────────┤
│ https://stackoverflow.com/a/385491/36866 │
└─────────────────────────────────────────────────────────────────────────────────┘
关于 Chrome 6.0.472 的注意事项:如果您执行强制重新加载(如 CTRL-F5),它的行为就像 url 在内部被标记为始终执行强制重新加载。如果您转到地址栏并按 Enter,则该标志将被清除。
通常来说,一般来说:
即使内容发生更改,F5 也可能会为您提供相同的页面,因为它可能会从缓存中加载页面。但是 Ctrl+F5 强制刷新缓存,并且会保证如果内容发生变化,你会得到新的内容。
我已经实现了跨浏览器兼容页面来测试 browser's refresh behavior(这里是 the source code)并获得类似于 @some 的结果,但适用于现代浏览器:
https://i.stack.imgur.com/vDrr1.png
至少在 Firefox (v3.5) 中,缓存似乎被禁用,而不是简单地清除。如果一个页面上有同一个图像的多个实例,它将被多次传输。随后通过 Ajax/JavaScript 添加的 img
标记也是如此。
因此,如果您想知道为什么浏览器在您的自动刷新 Ajax 站点上不断下载同一个小图标几百次,那是因为您最初使用 CTRL-F5 加载了该页面。
根据页面是否有焦点,IE7/8/9 的行为似乎有所不同。
如果单击页面并按 CTRL+F5,则请求标头中将包含“Cache-Control: no-cache”。如果单击位置/地址栏,然后按 CTRL+F5 则不是。
当用户按下 F5 时,尽管新请求会发送到 Web 服务器并获得对该请求的响应。但是当响应头被解析时,它会检查浏览器缓存中的所需信息。如果缓存中所需的信息尚未过期,则该信息将从缓存本身中恢复。
当用户单击 CTRL-F5 时,即使新请求进入 Web 服务器并获得响应。但是这次解析响应头时,它不会检查缓存中的任何所需信息,并且仅将所有更新的信息带入服务器。
不定期副业成功案例分享