嵌套 Iframe 在 Mozilla 上重新加载后没有内容

Question

I have this problem on Mozilla (worked perfectly on Chrome) where the nested Iframe doesnt have content after reload (only empty header and body tag)我在 Mozilla（在 Chrome 上完美运行）上遇到了这个问题，其中嵌套的 Iframe 在重新加载后没有内容（只有空的 header 和 body 标签）

Somehow you can click on the search bar and enter (instead of reload) to open again and all iFrame will load as intended您可以通过某种方式单击搜索栏并输入（而不是重新加载）以再次打开，所有 iFrame 将按预期加载

---------Working Snippet--------- --------工作片段--------

https://codesandbox.io/s/determined-edison-9rwhwv?file=/index.html https://codesandbox.io/s/determined-edison-9rwhwv?file=/index.html

Body index.html车身指数.html

<body>
    <div>Index</div>
    <iframe id="iframe"></iframe>
    <script>
        (function () {
            var b = document.getElementById("iframe");
            b.setAttribute("src", "iframe.html?" + Math.random() * 100);
        })();
        window.addEventListener('beforeunload', function (event) {
            console.log('I am the 1st one.');
        });
        window.addEventListener('unload', function (event) {
            alert('unLoad')
        });
    </script>
</body>

body iframe.html身体 iframe.html

<body>
    <header>
        IFRAME1
    </header>
    <iframe id="iframe2"></iframe>
    <script>
        (function () {
            var b = document.getElementById("iframe2");
            b.setAttribute("src", "iframe2.html?" + Math.random() * 100);
        })();
        window.addEventListener('beforeunload', function (event) {
            console.log('frame 1 before unload.');
        });
        window.addEventListener('unload', function (event) {
            console.log('frame 1 unload.');
        });
        window.addEventListener('pagehide', (event) => {
            if (event.persisted === true) {
                console.log('This page *might* be entering the bfcache.');
            } else {
                console.log('This page will unload normally and be discarded.');
            }
        });
    </script>
</body>

Body iframe2.html正文 iframe2.html

<body>
    <header id="h2">
        this is iframe 2
    </header>
    <script src="iframe2.js"></script>
</body>

I read something about bfcache, which is why i tried to put unload event to negate bfcache.我阅读了一些关于 bfcache 的内容，这就是为什么我试图放置卸载事件来否定 bfcache。

Found this thread with help from zer00ne about mixed content Mixed Content warning on Chrome due to iframe src在 zer00ne 的帮助下找到了这个关于混合内容的线程由于 iframe src 而导致 Chrome 上的混合内容警告

But this seems to be a security issue to do但这似乎是一个安全问题

Answer 1

I got it working by calling the function after load event我通过在加载事件后调用 function 使其工作

window.addEventListener('load', function () {
            function setIframe() {
                var b = document.getElementById("iframe");
                b.setAttribute("src", "iframe.html");
            }
            setIframe();
        })

Hope this helps anyone.希望这对任何人都有帮助。

嵌套 Iframe 在 Mozilla 上重新加载后没有内容

问题描述

1 个解决方案

解决方案1
1 2022-03-19 06:37:22

嵌套 Iframe 在 Mozilla 上重新加载后没有内容

问题描述

1 个解决方案

解决方案1 1 2022-03-19 06:37:22

解决方案1
1 2022-03-19 06:37:22