popup 부모 자식간 통신 정리 - 팝업 통신

데이터를 받는 쪽 Parent(부모)에서는 Child(자식)쪽에서 부터 보내지는 데이터를 받기 위해 이벤트 리스너를 등록해 놓고 있어야 한다

 window.addEventListener('message', function (event) {
      console.log(event.data);
 });

 

데이터를 보내는 쪽 Child(자식)에서는 

window.parent.postMessage('Hello pop up post message', '*');

개발을 하다보면 팝업을 띄워놓고 다른 사이트로 이동했다가 되돌아오거나 팝업을 띄운 사이트의 다른 페이지로 이동시키는 경우가 있는데 그 경우에는 window.opener 를 사용하면 된다

window.opener.parent.postMessage("Hello post message",'*');