如何使 iframe 不保存到 Chrome 中的历史记录？

Question

我正在尝试开发一个 Chrome 扩展程序，将 Angular 应用程序注入用户的浏览器窗口，以制作交互式侧边栏。通过内容脚本向页面添加 iframe 并将框架的源设置为我的扩展目录中的 html 文件，我基本上能够实现 100% 的目标。

不幸的是，由于 Angular 应用程序有多个路由（允许用户登录并查看许多不同类型的信息），我发现它会干扰用户使用他们的后退/前进按钮，这是预期的；当 iframe 的源因哈希变化而发生变化时，它会在历史记录中保存一个新条目。

我似乎找不到或为此创建解决方法；是否有一些聪明的方法可以让 Angular 不生成历史条目，或者实现创建一个不使用 iframe 不保存到历史记录的侧边栏，或者禁用 iframe 保存到历史记录？

Answer 1

最后，我一直在尝试编写一个 chrome 扩展，在 iframe 中嵌入一个 angular 应用程序，但发现所有哈希更改都会干扰 Chrome 的历史记录，因为 iframe 源由于路由更改而不断变化。

虽然我不能确定使用 ui-router 代替 angular 路由器是否可以让我规避我的问题（似乎 ui-router 使用状态，并且不一定需要更改 url，尽管我可能是错的），我已经确定根本原因是 iframe 源的更改，并且只有一种方法可以导致 iframe 不记录在历史记录中all：利用 window.location.replace 功能而不是直接更改位置。

为了确保我的 iframe 完全不会干扰 Chrome 的历史记录，我们采取了以下步骤：

1. 将 iframe 的 src 设置为 '#'before 附加到当前存在的文档
2. 将 iframe 附加到文档中
3. 直接访问 iframe 的内容窗口，以使用框架的 location.replace 函数来更新位置而不保存历史记录：
   1. $("#myIframe").get(0).contentWindow.location.replace(myUrl);
4. iframe 中所有更改 url 的代码都是通过使用 location.replace(url) 完成的
5. Angular 内部的重定向按如下方式处理：$location.path(newPath).replace() 以便 Angular 使用相同的策略。

一个更好的解决方案是弄清楚如何在默认情况下一直使用$location.replace()，我现在正在尝试实施。所以本质上，这一切都归结为：location.replace 将允许您更改 iframe 的源代码而不是保存到历史记录。