iframe：如何避免PostMessage

Question

我有一个Iframe，可显示来自第三方网站的内容，并在加载内容后将postMessage发送回父级。该代码在生产服务器上发布时有效（我猜是由于CORS设置），但在本地计算机上开发时则无效。它说：

  

”无法在“ DOMWindow”上执行“ postMessage”：目标来源   提供的（[外部站点]）与收件人窗口的   来源（[我的本地主机]）。”

是否可以在不使用postMessage的情况下使Iframe与父级进行交流？例如，通过让父级向iframe添加addEventListerner（“ load”）触发器？

以下是一些测试代码：

<div id="parentDiv"></div>

<script type="text/javascript"> 

function LoginToExternalSite() {
     // Doing 1-3 AJAX-calls to the 3:rd party site to 
     // make sure the application are allowed to use it.
     // If logged in, it calls LoadIframe.
     LoadIframe();
}

function LoadIframe(){      
    var div = document.getElementById("parentDiv");     

    var iframe = {};
    iframe = document.createElement("iFrame");
    iframe.id = "infra3dapi";
    iframe.style.height = '100%';
    iframe.style.width = '100%';
    iframe.style.border = 'none';
    iframe.style.overflow = 'hidden';
    iframe.src = "https://example.com";     
    div.appendChild(iframe);

    iframe.onload = function() {            
        iframe.contentWindow.parent.postMessage("Hello", 'https://example.com');                    
    };      
}

$(document).ready(function() {

      $(window).on("message", function(e) {           
            console.log("Messaged recieved.");
      });

      LoginToExternalSite();    
});