代码之家 › 专栏 › 技术社区 › Ramiz Uddin

刷新iFrame(缓存问题)

iframe html javascript

Ramiz Uddin · 技术社区 · 16 年前

我们得到了一个奇怪的问题,我们不知道究竟是什么原因。让我详细说明一下这个问题。假设我们有两个不同的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文件。问题是两个文件的内容都在服务器端成功更新。如果我们打开,我们可以看到更新的变化,但客户端得到了旧的内容,这并不显示更新的变化。

你知道吗?

5 回复 | 直到 10 年前

Tushar 10 年前

<head>
    <meta http-Equiv="Cache-Control" Content="no-cache" />
    <meta http-Equiv="Pragma" Content="no-cache" />
    <meta http-Equiv="Expires" Content="0" />
</head>

强制不进行缓存检查

Community Mohan Dere 8 年前

Making sure a web page is not cached, across all browsers (我认为大家一致认为第二个答案是最好的,而不是公认的答案)

Simone的答案已经涉及到元标记。

一个廉价的快速技巧是添加一个随机数作为GET参数:

page_1.html?time=102398405820

如果每次请求时都发生更改(例如,使用当前时间),则每次都会强制重新加载。

HoBa 13 年前

尝试以下操作:

<script>
    var frameElement = document.getElementById("frame-id");
    frameElement.contentWindow.location.href = frameElement.src;
</script>

Willito 12 年前

霍梅罗·巴博萨的解决方案非常有效。在我的例子中,页面上有不同数量的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;
});

Michael Freidgeim 4 年前

我想把 Vishwas comment Pekkaâs answer

//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');

-1

Community Mohan Dere 7 年前

对于一个可能的解决方案,将“cache参数”传递给对a.html和b.html的调用。例如

HTML格式

<input type="button" value="Load a.html" onclick="cacheSafeReload('a.html');">

function cacheSafeReload(urlBase) {
    var cacheParamValue = (new Date()).getTime();
    var url = urlBase + "?cache=" + cacheParamValue;
    reloadFrame(document.getElementById('myFrame'), url);
}

推荐文章

code-geek · Jquery根据单选按钮选择隐藏或显示文本字段

1 年前

Niobos · 如何/是否有方法使通用算法函数同时与同步和异步函数一起工作?

1 年前

Alex · 在轻量级中同时解构和不解构变量

1 年前

Ângelo Rigo · ReactJS映射:如何迭代[关闭]

1 年前

bairog · 从按属性筛选的对象数组字典中创建值数组

1 年前

KaiMcKiernan · 基于Math.random()的函数在另一个函数内不起作用[关闭]

1 年前

David Jeong · 浏览器不会为浏览器自动添加的某些标头发送CORS预检请求吗?

1 年前

user29519291 · 为不同的变量创建一个带有可重用Click函数的简单菜单

1 年前

user3472810 · Angular@Output/EventEmitter返回undefined

1 年前

lokiuucx · JS对象属性返回未定义,尽管对象属性应该有值

1 年前