刷新iFrame（缓存问题）
[英]Refresh iFrame (Cache Issue)
问题描述
我们遇到了一个奇怪的问题，我们不确定到底是什么原因造成的。 让我详细说明这个问题。 假设，我们有两个不同的 html 页面 a.html 和 b.html。 还有一个用 index.html 编写的小脚本：
<html>
<head>
<script>
function reloadFrame(iframe, src) {
iframe.src = src;
}
</script>
</head>
<body>
<form>
<iframe id="myFrame"></iframe>
<input type="button" value="Load a.html" onclick="reloadFrame(document.getElementById('myFrame'), 'a.html')">
<input type="button" value="Load b.html" onclick="reloadFrame(document.getElementById('myFrame'), 'b.html')">
</form>
</body>
</html>
服务器组件不断更新文件 a.html 和 b.html。 问题是两个文件的内容都在服务器端成功更新。 如果我们打开，我们可以看到更新的更改，但客户端获取的是不显示更新更改的旧内容。
任何的想法？
7 个解决方案
解决方案1
27 已采纳 2010-03-26 15:42:49
在 a.html 和 b.html 中添加这个
<head>
<meta http-Equiv="Cache-Control" Content="no-cache" />
<meta http-Equiv="Pragma" Content="no-cache" />
<meta http-Equiv="Expires" Content="0" />
</head>
强制不进行缓存检查
解决方案2
12 2010-03-26 15:44:34
如果您可以向这些 HTML 文件添加服务器端指令，则可以发送适当的标头以防止缓存：
确保所有浏览器都没有缓存网页（我认为共识是第二个答案是最好的，而不是公认的）
Simone 的回答已经涉及 Meta 标签。
一个廉价的快速技巧是添加一个随机数作为 GET 参数：
page_1.html?time=102398405820
如果每次请求都会改变（例如使用当前时间），则每次都会强制重新加载。
解决方案3
9 2012-07-02 19:11:57
尝试类似以下内容：
<script>
var frameElement = document.getElementById("frame-id");
frameElement.contentWindow.location.href = frameElement.src;
</script>
这将强制重新加载 iframe，即使它已被浏览器缓存
解决方案4
1 2021-06-05 03:33:51
我想把Vishwas 的评论作为一个单独的答案，扩展Pekka 的答案
//ensure iframe is not cached
function reloadIframe(iframeId) {
var iframe = document.getElementById(iframeId);
var d = new Date();
if (iframe) {
iframe.src = iframe.src + '?ver=' + d.getTime();
//alternatively frameElement.contentWindow.location.href = frameElement.src; //This will force the iframe to be reloaded even if it was cached by the browser
}
}
reloadIframe('session_storage_check');
解决方案5
0 2014-01-16 16:00:45
Homero Barbosa 的解决方案很有魅力。 就我而言，页面上有不同数量的 iframe，因此我执行了以下操作：
$('.some_selector').each(function () {
var $randid = Math.floor(Math.random() * 101);
$(this).attr({'id': 'goinOnaSafari-' + $randid});
var $frame = document.getElementById('goinOnaSafari-' + $randid);
$frame.contentWindow.location.href = $frame.src;
});
解决方案6
0 2022-02-18 11:26:24
我无法让 HTML 工作。
<head>
<meta http-Equiv="Cache-Control" Content="no-cache" />
<meta http-Equiv="Pragma" Content="no-cache" />
<meta http-Equiv="Expires" Content="0" />
</head>
对于 chrome 中的开发，我检查了控制台网络选项卡并找到了 iframe 的加载位置。 我确认它加载了 304 响应，这意味着它从缓存中加载。 右键单击 -> 清除浏览器缓存。
不会在生产中工作，但至少有助于开发。
解决方案7
-1 2010-03-26 15:43:48
对于此问题的一种可能解决方案，将“缓存参数”传递给您对 a.html 和 b.html 的调用。 例如
HTML
<input type="button" value="Load a.html" onclick="cacheSafeReload('a.html');">
Javascript
function cacheSafeReload(urlBase) {
var cacheParamValue = (new Date()).getTime();
var url = urlBase + "?cache=" + cacheParamValue;
reloadFrame(document.getElementById('myFrame'), url);
}
CRM 2013 iframe刷新问题
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.