我可以訪問另一個域上的iframe父項的javascripts

Question

我控制兩個域並可以設置任何必需的策略。 iframe中的域使用幾乎相同的庫，並且我希望如果可能的話將它們從父級引出。

要說清楚，我沒有問如何製作跨域請求。當我父母在另一個域上時，我問如何從iframe的父級獲取腳本。

我得到這個權限錯誤（在這裏，但同樣努力的jQuery與我的其他庫）：

if (typeof(jQuery) == "undefined") { 
    var iframebody = document.getElementsByTagName("body")[0]; 
    var jQuery = function (selector) { return parent.jQuery(selector, iframebody); }; 
    var $ = jQuery; 
} 
$("<h1>Hello World</h1>").appendTo("body"); 

，如果他們在同一個域這會​​工作。

我知道這是跨域的，並且出於安全原因被阻止，但考慮到我控制了這兩個域，並且都不是安全敏感的，我可以根據需要設置任何策略。

可以這樣做嗎？

Answer 1

您可以使用postMessage在框架及其父窗口之間來回傳遞信息。

https://developer.mozilla.org/en-US/docs/Web/API/Window/postMessage

你必須運行的代碼修改的元素在它生活的領域，但你可以在父把一根柱子消息handlerler踢它關閉。

// child window (iframe content) 
parent.postMessage("hi there", "https://parent.domain.here"); 


// parent window 
window.addEventListener("message", function(message){ 
    $("<h1>"+message+"</h1>").appendTo("body"); 
}); 

Answer 2

如果包含在這兩個頁面同一來源的JS，它只會被加載一次，但會訪問這兩個網站上：

//parent/main.html 
<script src="jquery.js"></script> 
<iframe src="http://other/iframe.html"></iframe> 
<script> 
    $(document.body).html("wohoo"); 
</script> 

//other/iframe.html 
<script src="http://parent/jquery.js"></script> 
<script> 
    $(document.body).html("wohoo"); 
</script> 

所以，如果theyre在iframe訪問，該腳本只是加載一次，如果你沒有其他人訪問它們，它仍然可以工作。