티스토리 뷰

Web/JavaScript

Cross-Domain

Su-Dong, Han 2013. 3. 12. 15:45


ajax와 mash-up이 활성화 되면서 cross-domain 이슈가 빈번히 발생하고 있습니다.

하나의 사이트에서 모든 정보를 보여주기 보다는 다른 사이트와 연계해서 새로운 데이터를 창출하고자 하기 때문입니다.

하지만 ajax의 주요 기술인 javascript는 동일한 domain에서 동작하도록 되어 있어 우회 방법이 필요합니다.

최근에 CORS(Cross Origin Resource Sharing) 관련 헤더값이 추가되었다고는 하지만

브라우저에서 지원하지 않는 버전이 있어 실서비스에 활용은 어려울거 같습니다.

1. document.domain 활용

 - document.domain에 도메인 값을 지정하면 서로 다른 서브 도메인간 호출이 가능해집니다.

   이 경우 메인 도메인은 동일해야 한다는 조건이 있습니다.

 * 추가 : IE8, 크롬 테스트 결과 이 방법은 잘 안되네요.. 단순히 domain 값만 바꿔서 되는게 아닌거 같습니다..

 * 다시 추가 : 테스트를 해보니 이 케이스는 현재 페이지에서 다른 도메인의 페이지를 iframe을 통해 제공하고 있을때,

                     iframe 내부에서 현재 페이지(parent)에 접근을 하는 경우에 유효하네요..

                     parent와 iframe 내부 페이지의 document.domain 값을 동일하게 맞춰주면 iframe에서 parent 접근이 가능해집니다. ^^

2. JSONP(JSON with Padding) 활용

 - GET 방식만 지원하지만 script 태그의 src 속성을 활용하는 방법입니다.

   (JSONP 게시글 참고)

3. CORS 설정

 - IE는 10버전부터 지원 예정. (10 이전 버전은 XDomainRequest Object 사용)

 - 서버 쪽에서 Response Header의 Access-Control-Allow-Origin 값에 허용할 URL을 설정해줘야 함

   (서버에서 Access-Control-Allow-Origin 값을 설정하기 전에 request header에 세팅된 Origin 값을 체크해서 설정)

   ex) response.addHeader("Access-Control-Allow-Origin", "http://example.com") 

         response.addHeader("Access-Control-Allow-Origin", "*") 


참고http://cafe.naver.com/webprogrammer2/43


'Web > JavaScript' 카테고리의 다른 글

이벤트 핸들러의 종류  (0) 2007.07.02
댓글