[JS] 자식 창과 부모 창의 도메인이 다를 때 opener 제어

작업도중 자식창이 다른 도메인인 경우가 생겼다. 자식창에서 데이터 upload 이후에 부모창을 reload 해주려고 했는데 opener로 컨트롤이 되지 않아 확인해보니 도메인이 달라서 부모창을 제어할 수 없는 문제였다.
그래서 찾아보니 postmessage를 통해 간단하게 해결할 수 있었다.

자식창에서 부모창 컨트롤을 위해 다음 코드를 실행하고

//자식창에서 부모창으로 보내는 postMessage
window.opener.postMessage({code:"parentcontrol"}, '*');

부모창에서는 메시지를 받아 내가 실행할 코드를 삽입했다.

const receiveMessage = function(e){
    //메시지를 받았을 때 실행할 코드 
    if(e.data.code == "parentcontrol" && e.origin == 자식창 도메인){
        location.reload();
    }
}

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

if문안에서 받아온 코드와 자식창 도메인을 검사해서 악의적으로 접근할 수 없도록 제한을 걸어두었다.