2

In a test page 'index.html' whose content: Test link

<h2 id="at"></h2>
<div id="a"></div>
<h2 id="bt"></h2>
<div id="b"></div>
<h2 id="ct"></h2>
<div id="c"></div>
<h2 id="dt"></h2>
<div id="d"></div>

<script>
    var wraps = [document.getElementById('a'), document.getElementById('b'), document.getElementById('c'), document.getElementById('d')],
        titles = [document.getElementById('at'), document.getElementById('bt'), document.getElementById('ct'), document.getElementById('dt')],
        arr = ['a', 'b', 'c', 'd', 'e', 'f', 'g'],
        l,
        i,
        r;

    for (i = 0; i < 4; i++) {
        l = arr.length;
        r = Math.floor(Math.random() * l);
        titles[i].innerHTML = 'iframe ' + arr[r].toUpperCase();
        wraps[i].innerHTML = '<iframe src="' + arr[r] + '.html" frameborder="1" width="600" height="60"></iframe>';
        arr.splice(r, 1);
    }
</script>

where a-g.html are files contain sample code. When open index.html first time in IE(i test in IE 11), it displays correct content. Then refresh this page, these iframes' src attributes change, but there content don't change, just keep the same as the first time load.

This problem only exist in IE when refresh.

I found tow options to solve it:

1)add iframe to page first, then set it's src by js;

2)disable cache in http serer

But this two options are not good, I want to know is there any other way to solve the problem.

Some failed tests:

1)add random string to url

2)disable cache by adding meta tag in iframe's head

dencey
  • 1,041
  • 17
  • 25
  • possible duplicate of [Refresh iFrame (Cache Issue)](http://stackoverflow.com/questions/2524502/refresh-iframe-cache-issue) – Liam Mar 17 '14 at 10:20
  • that solution cannot solve the problem, pls check failed test 2 – dencey Mar 18 '14 at 02:53

1 Answers1

3

You can add a (pseudo) random string to the end of the URL of your iframe.

Something like this:

var randValue = (new Date()).getTime();
wraps[i].innerHTML = '<iframe src="' + arr[r] + '.html?cache=' + randValue + '" frameborder="1" width="600" height="60"></iframe>';

Updated

It seems that IE is serving the content of the iFrames out of it's cache. If you check the network panel in IE it shows a HTTP status code 304.

You might want to look at this article Internet Explorer IFRAME Browser History Lost on Reload. This might give you a possible solution to your problem.

Ex-iT
  • 1,479
  • 2
  • 12
  • 20
  • this solution also fails, please check failed test 1 which i updated in the question – dencey Mar 18 '14 at 02:54
  • @Liam you are right, but I thought in this case it might have worked. Unfortunately according to dencey it doesn't. – Ex-iT Mar 18 '14 at 11:02
  • @dencey I've updated my answer with a link to a possible solution to your problem. – Ex-iT Mar 18 '14 at 15:16
  • @Liam, i use new Date().getTime() + i(i = 0-3, corresponding to 4 iframes) to generate a string in url, i think in every refresh(as only the interval is more than 4ms) the string is different from each other. – dencey Mar 19 '14 at 03:15
  • @Ex-iT I've read the article you linked, I think it describes a similar problem like this, but I haven't understood its' content fully and cannot find a solution except the two in my question. At present, I use js to set src attribute dynamically to prevent this bug. – dencey Mar 19 '14 at 03:22