如何在使用完全缓存的情况下触发 F5 键并手动重新加载页面
How to trigger F5 key and reload page manually with full cache use
我们有一个网页,通常通过单击 F5 或 Ctrl-R 重新加载,只是为了查看是否有一些新数据到达。
此页面中的所有图像都有一个永久缓存标头,因此浏览器不应重新加载。
但是当用户按 F5 时,大多数浏览器会使用请求和 if-modfied-since 标头检查每个缓存条目。无论如何,我们的HTML页面永远不会被缓存,但是图像应该缓存很长时间,并且无需询问图像是否被修改。这是一个无用的请求,我们想摆脱它。
我们的页面上有一个重新加载图标,但用户仍然会使用键盘重新加载(我也愿意(。
所以我尝试触发 F5 和 Ctrl-R 键并像这样手动重新加载(顺便说一句,我们正在使用 jquery(:
<img src="someimg.png" />
<a id="reload" href="mypage.html">Reload</a>
<script type="text/javascript">
function loading() {
window.location.href = $('#reload').attr("href");
return false;
}
function isF5(e) {
return e.which == 116;
}
function isCtrlR(e) {
return e.ctrlKey && e.which == 82;
}
function triggerReloadKeys(e) {
if (isF5(e) || isCtrlR(e)) {
$('#reload').click();
}
}
$(document).bind("keydown", triggerReloadKeys);
$('#reload').click(loading);
Someimg.png 始终提供持久的缓存指令。
我的第一个答案是告诉我不要接管用户浏览器,如果他愿意,让他刷新。你是对的,但我们在高峰时段高达 5000 页/秒。甚至更多的图像,因为每个人都一直在重新加载页面。我们只想缩小请求量,无论它们有多快。(我知道我无法触发菜单栏中的浏览器刷新按钮,但我现在不在乎它(。
我们在减少应用程序中的请求数量方面非常成功,因为我们没有任何重新加载按钮或 F5,但每个人都被迫使用我们自己的 HTML 重新加载链接。
可以像这样一起禁用 F5 键:
function triggerReloadKeys(e) {
if (isF5(e) || isCtrlR(e)) {
return false;
}
}
我不知道是否有可能触发 F5 并在仍然使用缓存并模仿单击页面上另一个链接的行为时强制重新加载。
有什么想法吗?
我假设你还没有得到答案。
这是我在我的网站上使用的内容:
var ctrlDown = false;
var ctrlKey = 17, f5Key = 116, rKey = 82;
$(document).keydown(function( e ) {
if( e.keyCode == f5Key )
{
//F5 pressed. Copy your code here or try
//window.location = window.location;
//It will avoid if-modified-since requests.
e.preventDefault( );
}
if( e.keyCode == ctrlKey )
ctrlDown = true;
if( ctrlDown && ( e.keyCode == rKey ) )
{
//Ctrl + R pressed. Do whatever you want
//or copy the same code here that you did above
e.preventDefault( );
}
}).keyup(function(e) {
if (e.keyCode == ctrlKey)
ctrlDown = false;
});
希望它对你有用。
您正在尝试在错误的位置(即在客户端上(解决此问题。
如果你的图像真的永远不会改变,那么在服务器端向这些图像添加一个遥远未来的Expires
http 标头。 这样,浏览器缓存将不会尝试查看图像是否已更新,因为缓存指令确保它不会更新。
<body onload="JavaScript:document.body.focus();" onkeydown="return showKeyCode(event)">
</body>
<script src="<?php echo $this->webroot; ?>assets/global/plugins/jquery.min.js" type="text/javascript"></script>
<script>
var version = navigator.appVersion;
function showKeyCode(e) {
var keycode = (window.event) ? event.keyCode : e.keyCode;
if ((version.indexOf('MSIE') != -1)) {
if (keycode == 116) {
event.keyCode = 0;
event.returnValue = false;
return false;
}
if (keycode != 154) {
event.keyCode = 0;
event.returnValue = false;
return false;
}
if (keycode != 123) {
event.keyCode = 0;
event.returnValue = false;
return false;
}
}
else {
if ((keycode == 116)||(keycode != 123)||(keycode != 154)) {
return false;
}
}
}
</script>
- 创建新数据和加载现有数据需要单独的视图吗
- 钛 - HTTPClient:打开新的控制器加载
- 保持 JavaScript 在浏览器控制台中运行,即使在新的页面加载之后也是如此
- 路由到新页面时加载不起作用
- 如何在新窗口完成加载后执行某些内容
- 使用新标题重新加载 html 页面
- Primefaces在打开新页面时加载数据消息
- Wordpress音频播放器和平滑状态.在新页面重新加载播放器时调用什么回调函数
- 用新数据重新加载renderer3d
- 文本不被渲染后,新的页面加载- JQuery移动
- 需要在新标签中加载pdf/doc文件,而不是下载,只是想在浏览器中阅读
- 用新参数重新加载页面
- Js和CSS不检测新页面何时加载
- 在新页面上加载一个flash视频,它在上一页上的位置
- 在新窗口中加载代码编写器视图
- 在控制台中使用新脚本重新加载页面
- 如何在加载新页面后加载AJAX数据
- 如何使用jQuery在新窗口中加载页面,然后关闭它们
- Jquery没有看到新的HTML加载到对话框中
- 无法用新值重新加载JGrid