从不同域的父级读取和操作ifame的文档对象模型

Question

我想实现一个页面，该页面可以显示（嵌入）来自完全不同的域的另一个页面，该域不在我的控制之下。 （例如www.google.com）。 最终用户在父页面中填写url输入字段，然后父页面显示嵌入的内容。

到目前为止，这可能很容易，但是父页面必须具有读取和操作嵌入式页面文档的能力。 只是强调元素没什么花哨的。 我知道这引起了严重的安全问题。 从子页面读取的某些数据必须发送到我的服务器（与父页面相同的域）

（请注意，尽管有这个话题，但此应用程序将是完全合法的商业服务，与任何灰色或黑色技巧或做法无关）

• 有可能吗？
• 如果最终用户安装了我的扩展程序（为完成任务而使用一些辅助功能编写）并信任我作为发布者，是否有帮助？
• 如果以上方法均无济于事，那么除了这个iframe创意外，还有什么方法可以完成指定的任务？

编辑

（该应用程序应针对Chrome，FF和IE实施，我无法添加超过5个标签。）

Answer 1

一种选择是将DOM编辑移至应用程序的后端。

详细地说，我一年前做了一个与此类似的项目，我们还希望能够突出显示页面上的文本部分。 我们将HTML加载到后端的iframe中，使用了一个模仿jQuery的库（在本例中为pyquery），并在那里对DOM进行了修改。 在我们的案例中，这只是在文本周围添加跨度以突出显示。

这种方法的问题在于您无法预测任意网站的DOM的外观，因此该应用程序将相当脆弱。 甚至像在给定的一组文本周围添加span标签一样简单的操作也可能破坏页面。

Answer 2

可以使用Chrome扩展程序来完成。 基本思想是在父页面和嵌入式页面中注入内容脚本 ，这将使您能够与页面内容进行交互。 然后，您将使用背景页面通过chrome.runtime API在两个页面之间传递信息。