크로스도메인 window.postMessage()

/*

 * In window A's scripts, with A being on <http://example.com:8080>:

 */

var popup = window.open(/* popup details */);

 

// When the popup has fully loaded, if not blocked by a popup blocker:

 

// This does nothing, assuming the window hasn't changed its location.

popup.postMessage("The user is 'bob' and the password is 'secret'", "https://secure.example.net");

 

// This will successfully queue a message to be sent to the popup, assuming

// the window hasn't changed its location.

popup.postMessage("hello there!", "http://example.com");

 

function receiveMessage(event)

{

  // Do we trust the sender of this message?  (might be

  // different from what we originally opened, for example).

  if (event.origin !== "http://example.com")

    return;

 

  // event.source is popup

  // event.data is "hi there yourself!  the secret response is: rheeeeet!"

}

window.addEventListener("message", receiveMessage, false);

 

/*

 * In the popup's scripts, running on <http://example.com>:

 */

 

// Called sometime after postMessage is called

function receiveMessage(event)

{

  // Do we trust the sender of this message?

  if (event.origin !== "http://example.com:8080")

    return;

 

  // event.source is window.opener

  // event.data is "hello there!"

 

  // Assuming you've verified the origin of the received message (which

  // you must do in any case), a convenient idiom for replying to a

  // message is to call postMessage on event.source and provide

  // event.origin as the targetOrigin.

  event.source.postMessage("hi there yourself!  the secret response " + "is: rheeeeet!", event.origin);

}

 

window.addEventListener("message", receiveMessage, false);

<filter>

  <filter-name>CorsFilter</filter-name>

  <filter-class>org.apache.catalina.filters.CorsFilter</filter-class>

  <init-param>

    <param-name>cors.allowed.origins</param-name>

    <param-value>http://아이피:포트</param-value> <!-- 호출페이지가 위치한 서버의 도메인 주소

  </init-param>

  <init-param>

    <param-name>cors.allowed.methods</param-name>

    <param-value>GET,POST,HEAD,OPTIONS,PUT</param-value>

  </init-param>

  <init-param>

    <param-name>cors.allowed.headers</param-name>

    <param-value>Pragma,Expires,If-Modified-Since,Cache-Control,Content-Type,X-Requested-With,accept,Origin,Access-Control-Request-Method,Access-Control-Request-Headers</param-value>

  </init-param>

  <init-param>

    <param-name>cors.exposed.headers</param-name>

    <param-value>Access-Control-Allow-Origin,Access-Control-Allow-Credentials,</param-value>

  </init-param>

  <init-param>

    <param-name>cors.support.credentials</param-name>

    <param-value>true</param-value>

  </init-param>

  <init-param>

    <param-name>cors.preflight.maxage</param-name>

    <param-value>10</param-value>

  </init-param>

</filter>

<filter-mapping>

  <filter-name>CorsFilter</filter-name>

  <url-pattern>/*</url-pattern>

</filter-mapping>

response.setHeader("Access-Control-Allow-Headers", "accept, cache-control, content-type, expires, if-modified-since, pragma, x-requested-with");

response.setHeader("Access-Control-Allow-Methods", "POST, GET, PUT, DELETE, OPTIONS, HEAD") ; // CORS에서 허용하는 메소드

response.setHeader("Access-Control-Max-Age", "3600"); // CORS가 유효한 시간

response.setHeader("Access-Control-Allow-Origin", "*"); // CORS를 허용하는 Origin

response.setHeader("Access-Control-Allow-Credentials", "true");

<script type="text/javascript">

    var retValue = "";

    

     window.onload = function() {

         if (window.addEventListener) {  // all browsers except IE before version 9

             window.addEventListener ("message", OnMessage, false);

         }

         else {

             if (window.attachEvent) {   // IE before version 9

                 window.attachEvent("onmessage", OnMessage);     // Internet Explorer from version 8

             }

         }

    }

 

    function OnMessage (event) {

        // Check the location of the caller

        // Opera earlier than version 10

        if ('domain' in event) {

            alert("event.domain-"+event.domain);

            if (event.domain != "http://172.10.12.11:9290") { //허용할 도메인 주소(호출페이지)

                return;

            }

        }

 

        // Firefox, Safari, Google Chrome, Internet Explorer from version 8 and Opera from version 10

        if ('origin' in event) {

            alert("event.origin-"+event.origin);

            if (event.origin != "http://172.10.12.11:9290") { //허용할 도메인 주소(호출페이지)

                return;

            }

        }

        

        message = '잘 받았습니다'; //회신할 메세지

        message = event.data + message;

        event.source.postMessage (message, event.origin);

    }

</script>