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

Question

我正在尝试开发一个 Chrome 扩展，将 Angular 应用程序注入(inject)用户的浏览器窗口，以制作交互式侧边栏。通过内容脚本向页面添加 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 的源代码而不保存到历史记录。