訪問位於不同域中的<iframe>的文檔文本

我正在實施將包含在第三方網站的文章/故事頁面上的「小部件」。此小部件位於我們的域中託管的<iframe>中。它需要從其父頁（第三方網站）的文章中收集文本，然後用它對返回相關內容的服務進行各種API調用，然後將其顯示在我們的<iframe>小部件中。訪問位於不同域中的<iframe>的文檔文本

由於跨域安全限制，我無法訪問父頁面的DOM，其中存在問題。我可以在父頁面上放置任何我需要的代碼（例如，一些解析出我需要的內容的JavaScript），並且iframe >也完全在我的控制之下，但我不確定如何從主機頁面獲取內容到我的<iframe>，因爲它們託管在不同的域上。安全性非常重要，我希望找到一種不會以任何方式危害的方法。

我最初的想法是從父頁面的頁面內容傳遞到我的< IFRAME SRC =「」使用的查詢參數>屬性：

<iframe src="http://www.mydomain.com/widget.html?page_content=This is some page content."></iframe>

我可以在父頁面上使用<腳本>收集文本，然後document.write一個<iframe>，它使用持有我的文本的字符串來創建一個動態的「page_content」查詢參數。然後page_content參數將可用於document.href中我的<iframe>頁面。

但是，我需要從父頁面收集8 KB的文本，我的理解是GET請求有1 KB的限制 - 這是真的嗎？如果沒有，或者如果我可以在我的服務器上配置此限制，則可能解決問題。

如果這將是一個限制，我還可以如何獲得創意並將此文本傳遞到我的小部件中？這需要一個非常可擴展的解決方案，因爲父網站每月獲得數千萬的頁面瀏覽量。我也不想以重要的方式影響父頁面的性能。

我在我的小部件中有jQuery可用，但不能依賴除父頁面中的普通JavaScript之外的其他任何東西。

來源

2009-10-02 Bungle

如果您擔心GET請求的數據太多，請改爲使用POST請求。你可以嘗試像這個問題的答案："How do you post to an Iframe?"。然後，您可以將數據放在隱藏的textarea中，並在父頁面上使用JavaScript提交表單。

來源

2009-10-02 17:15:17 wdebeaum

感謝您的回覆，wdebeaum - 這是一個很好的建議，但是不會涉及到服務器之旅，然後在<iframe>小部件中使JavaScript數據訪問POST數據？我不認爲有一種方法可以讓小部件訪問POST數據，否則;性能在這裏至關重要，所以如果可能的話，我想避免額外的服務器行程。在這種情況下GET請求的美妙之處在於，它更多地用作從不同域中輕鬆訪問某些文本（作爲查詢參數）的手段。 – Bungle 2009-10-03 21:03:21

我不明白如何POST請求會暗示一個額外的旅程相對於GET請求服務器......他們都去服務器，以獲得iframe的內容。然後，服務器可以將查詢參數（無論是GET還是POST）放入其回覆中，以使iframe中的JavaScript可以訪問該參數。如果你說設置iframe的src屬性應該以某種方式傳播到document.href屬性而不實際從服務器請求頁面，我不知道這是真的。 – wdebeaum 2009-10-06 20:48:02

實際上，你可以使用name屬性來做這件事，它有相當多的數據空間。

在託管頁面上，首先創建iframe，設置其.name屬性以包含所需的數據，然後設置.src屬性以加載包含的站點。現在可以訪問自己的名稱，因此也可以訪問數據。

託管站點可能需要首先將iframes .src設置爲本地頁面，這會捕獲父文檔數據，放入其.name屬性並重定向到inteded站點。

來源

2009-12-15 22:38:31

如果您可以控制兩個域，則可以嘗試一個跨域腳本庫，如EasyXDM，它涵蓋了跨瀏覽器的怪癖（包括Sean提到的名稱屬性），並提供了一個易於使用的API使用該瀏覽器的最佳可用機制（例如，如果可用，則爲postMessage，否則爲其他機制）在不同域之間的客戶端腳本中進行通信。注意：您需要對兩個域進行控制才能使其正常工作（其中「控制」意味着您可以在兩者上放置靜態文件）。但是您不需要任何服務器端代碼更改。

另一個警告：這裏有安全隱患 - 確保您信任其他域的腳本！

來源

2010-05-04 18:00:37

訪問位於不同域中的<iframe>的文檔文本

回答

相關問題