嵌入iframe 的页面 history 流程(浏览器后退)

发布网友发布时间：2024-03-07 18:28

共1个回答

热心网友时间：2024-07-22 21:14

以下内容仅仅是个人经过测试后的猜测！！如果知道官方的定义的，请再评论区指条明路~

把 iframe 考虑成浏览器新开的 tab 页，是比较合适的~

假设页面上只嵌入了一个 iframe 元素。以下内容顶层网页用 top 表示，嵌入的 iframe 网页用 iframe 表示。

浏览器的后退按钮是面向用户的，既作用整个页面，包含 top 和 iframe 。 top 上的 history 和 iframe 上的 history 的 length 是相同的。 window.history.length === window.top.history.length 。

Chrome 的 history，不仅利用了每一步 top 和 iframe 的状态，还利用了这一步是由那个 window 引起的。点击回退只会使参与了 history 的那个 window 回到上一步该有的状态，点击前进类似。Firefox 跟 Chrome 类似。

在 Safari 上 top 和 iframe 是分开的，然后再根据 history 的形成过程进行组合。
在 Safari 上的结论就相对 Chrome 来说要简单一些，但使用 replace 后整个 history 的逻辑对用户来说可能就难以理解了（如上面例子）。测试中 top 的 page 地址都取至控制台输出 location，有可能与地址栏展示的网址不一致，见下面存在的问题。