從不同域的父級讀取和操作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在兩個頁面之間傳遞信息。