새로운 회사에 입사한지 1주가 되었다😊
지난주부터 감기기운이 슬슬 돌더니 주말에 심해져서 결국 월요일인 오늘 출근을 못하고 휴가를 내고.. 병원 가기 전에 회사를 못 간 대신 공부라도 조금 하려고 글을 쓴다😥
1인 웹개발자로 일하던 전 직장과는 다르게 사수분도 있고 다른 개발자분들도 있는 곳이라 혼자 몇개월 일하던 것보다 여기서 1주 있던게 더 많은 도움이 된 것 같은 기분이었다😘
다른 사람의 코드를 분석한다는 것이 어려워 입사 전에 좀 걱정을 했었는데 정석대로 잘 짜여 있어서 알아보기도 쉬웠고 내가 써보지 않은 모르는 것들도 꽤 있어 폰에 메모해놓기도 했다. 메모한 것들을 매일 퇴근 후 집에 와서 블로그에 정리하려 했으나 1인 가구로써.. 집안일도 많고 하다보니.. 1주가 지난 지금에서야 하나씩 정리해두려 한다.
그 중 하나인 postmessage 에 대해 공부해보려 한다.
스크립트는 일반적으로 자신이 포함된 문서와 출처가 동일한 문서나 창의 프로퍼티만 읽을 수 있다.
postMessage() 는 자바스크립트에서 사용되는 메서드로, 다른 윈도우나 프레임과 안전하게 메세지를 주고 받을 수 있도록 해준다. 일반적으로 이 메서드는 다른 출처에서 로드된 프레임 간에 통신할 때 사용된다. 해당 메서드는 CORS(Cross-Origin Resource Sharing)를 우회하고 다른 출처의 문서와 통신할 수 있는 방법 중 하나이다. 원래는 동일 출처 정책에 의해 제한되는데 이 메서드를 사용하면 브라우저의 보안정책을 우회할 수 있다.
페이지와 생성된 팝업간의 통신, 페이지와 페이지 안의 iframe 사이의 통신에 사용된다.
문법
targetWindow.postMessage(message, targetOrigin);- targetWindow 를 생성하는 방법
- Window.open (새 창을 만들고 새 창을 참조할 때)
- Window.opener (새 창을 만든 window를 참조할 때)
- HTMLIFrameElement.contentWindow (부모 window에서 임베디드된 iframe을 참조할 때)
- Window.parent (임베디드된 iframe 에서 부모 window를 참조할 때)
이렇게 targetWindow 를 생성 후 다른 window에 보내질 데이터를 message 부분에 실어서 보낸다. targetOrigin 에는 tagetWindow의 origin을 지정하며 별도로 지정하지 않음("*") 으로 지정하거나 URI를 작성한다.
