- Same Origin Policy
- 특정 origin의 웹 문서가 다른 origin의 웹 문서에 대해서 속성들을 획득/수정(get/set)이 불가능한 것.
Same origin은 같은 프로토콜(http나 https) 그리고 같은 host(주소), 그리고 같은 포트번호를 가진 것을 말한다.
HTML5 Cross-Document Messaging
Cross-Document Messaging은 다른 origin을 가진 사이트끼리 데이터를 주고 받는 것이다. 하지만 악의적인 공격에 의해 웹 브라우징을 하는 클라이언트들이 피해를 볼 수 있기 때문에, 브라우저 벤더들에서는 Cross-Document Messaging을 허용하지 않고 있다.
하지만 여러 사이트들에서 가져온 정보를 가지고 새로운 정보를 만들어 내는 Mashup의 경우는 Cross-Document Messaging로 인해 제약을 많이 받고 있다. 이러한 문제를 해결하기 위해서 HTML5에서는 Cross-Document Messaging라는 스팩을 정의하고 있다.
Cross-Document Messaging는 iframe, tab, window들 간에 안전한 cross-origin 통신을 가능하게 한다. Cross-Document Messaging는 메세지를 전송하기 위한 표준화된 방법으로 postMessage API를 정의하고 있다.
chatFrame.contentWindow.postMessage('Hello, world', 'http://www.example.co.kr');
메세지를 수신하기 위해서는 페이지에 이벤트 핸들러만 추가시켜 주면 된다. 이벤트 핸들러를 통해 메세지가 도착했을 때, origin을 확인할 수 있고 메세지로 무엇을 할지 말지 결정할 수 있다. 아래는 임으로 정의한 messageHandler라는 함수를 이용하여 메세지를 처리하는 과정을 나타내고 있다.
window.addEventListener("message",messageHandler,true); function messageHandler(e) { switch(e.origin) { case "friend.example.com": // 메세지 처리 processMessage(e.data); break; default: // 메세지의 origin을 인식할 수 없음니다. // 메세지 무시 } }
아래는 IBM에서 제공하는 PPT로 Cross-Domain에 대한 해법들에 대해서 매우 잘 정리하고 있다.