2012-11-14 50 views
4

我有一個小部件託管在一個域和多個網站上,它們使用iframe來顯示小部件。我希望根據父網站對iframe的內容進行樣式設計,但我知道由於Same Origin Policy父網站無法操作來自其他域的內容。如何在不同的域上設置iframe的內容?

我有機會獲得小部件和父母雙方的網站,想知道什麼是改變取決於父網站上的小部件的風格的最佳方式是什麼?我更喜歡一種方法,這意味着如果一個新的網站需要包含iframe或一個現有的網站改變了他們的樣式,我不會改變這個小部件。

會通過母體網站的樣式表的位置,通過微件,並使用該樣式的小部件是一個可行的想法,什麼是要做到這一點,如果它是最好的方法?

+0

難道你不能把它作爲querystring參數傳入嗎? – Lloyd

+1

您可以使用JavaScript包含該小部件,然後根據某些設置構建該小部件的URL。這將使人們能夠輕鬆地包含它。你也可以在小部件網站上生成這個。像「widget.com/widget.html?color =#333&bg = red&size = 12」這樣的東西就可以做到。如果您將其作爲文件'widget.com/widget.html?css = // example.com/css/style.css'包含,請務必避免使用XSS等。安全在這裏很重要。很多事情都可能發生。 –

回答

0

在你所在的服務器控件託管可以通過使用獲得從那裏請求來的頁面(如果你使用PHP):

$_SERVER["HTTP_REFERER"] 

此基礎上,你可以使用不同的樣式用於微。

+0

引薦是不可靠的恕我直言。 – Lloyd

0

我建議建立該窗口小部件位於,基於查詢字符串參數返回CSS服務器上的Web服務。小部件iframe可以加載位於外部的資產,只要它們在HTML中明確定義並且不會動態附加到DOM(請考慮Google託管的JavaScript庫,如jQuery和關聯的CSS)。

另一種解決方案,假設你使用最新的瀏覽器,你可以使用window.postMessage

該API允許你從父窗口的調度事件(和數據與它一起...如CSS串)兒童窗口。

相關問題