javascript - 不同端口上不同应用程序的跨域消息传递

Question

我正在尝试使用 postMessage( ) 将消息从一个应用程序发送到另一个应用程序。我的一个应用程序位于 liberty 服务器上，端口为 9080，另一个应用程序位于 tomcat 上，端口为 8080。当我使用相同的应用程序尝试它时，我可以发布消息，但对于同一服务器或不同服务器上的不同应用程序，它不起作用。窗口打开了，但内容没有显示。

以下是我的文件 -

1) 家长应用程序(我从中发送内容的应用程序)

<script type="text/javascript">
 function Menu() {
      var opener=window.open("http://localhost:9080/Ancillary/index.jsp");
  opener.postMessage('Hello', 'http://localhost:9080');
    //opener.callback(document.getElementById("textField").value);
}
 </script>
 <button id="send" onclick="Menu();">Try it !</button>'

2)子应用程序(接收消息)

<script>
function receiver(event) {
         if (event.origin == 'http://localhost:9080') {
         console.log(event.data+' recieved by parent');
        alert(event.data+' recieved by parent');
  }
}
   window.addEventListener("message", receiver, false);
 </script>
  <p>This is an Example!</p>

现在我正在尝试让它在同一服务器上使用不同的应用程序工作。

Answer 1

您需要在 Web Api 中启用 CORS。全局启用 CORS 的更简单且首选的方法是将以下内容添加到 web.xml

<init-param>
<param-name>cors.supportedHeaders</param-name>
<param-value>Accept, Origin, X-Requested-With, Content-Type, Last-Modified</param-value>
</init-param>