Skip to content
This repository was archived by the owner on Aug 11, 2025. It is now read-only.
This repository was archived by the owner on Aug 11, 2025. It is now read-only.

如何实现一个更加纯粹的iframe #99

@yiludege

Description

@yiludege

我是无界微前端的作者,制作动机可查看文章,最近才看到这个微前端实现的思路和我的方案非常一致,而且也碰到相同的问题,子应用需要一个空白的、同域的、浏览器前进后退可以生效的 iframe 作为沙箱。

由于 设置 iframe src 等于主应用域名,然后 appendChild 到 body 后通过 document.write 操作:

iframe.contentDocumennt.open();
iframe.contentDocumennt.write("");
iframe.contentDocumennt.close();

就可以得到一个空白的、同域的iframe,history.pushState 也可以正常工作,唯独一点,当子应用跳转路由后点击浏览器后退发现无效。

所以无界还是采用直接加载 iframe src 等于主应用域名的地址,然后等 location origin 初始化成主应用域名后立即停止iframe的加载,此时history.pushState 也可以正常工作、子应用跳转路由后点击浏览器后退也可以生效到子应用,但是在等待 location origin 初始化的过程中运行了部分主应用的代码,所以最好也要给一个宿主应用空的同域 URL 来作为这个 iframe 初始加载的 URL

想探讨一下有没有什么办法可以得到一个空白的、同域的、浏览器前进后退可以生效的 iframe 而不产生副作用

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions