본문 바로가기
기타/프로그래밍 관련

자식 iframe에서 부모 자바 스크립트 실행(크로스 도메인 해결)

by WebHack 2015. 3. 10.

ㅇ 부모

if (window.addEventListener) {

    window.addEventListener('message', postMessageController, true);

}else if(window.attachEvent) {

    window.attachEvent('onmessage', postMessageController);

}

 

function postMessageController(_thisEvent){

    if(_thisEvent.origin !== 'http://www.iframe.com') {

        alert('postMessage 보안 에러');

    } else {

        document.getElementById('contentFrame').style.height = _thisEvent.data.height + 'px';

    }

}


ㅇ 자식(iframe에서 호출된 객체)

if(window.name == 'contentFrame') { // 부모 html상의 iframe의 name 임

    var _sendData = {'url':document.location.href, 'height':$(document).height()};

    /*

    $(document).height()가 정상적이지 않을 때는

    $('#bodyFooterDiv')[0].offsetTop 사용((_thisEvent.data.height + 100) 'px';)

    */

    window.parent.postMessage(_sendData, "http://www.parent.com");

}


부모 도메인과 자식 도메인을 정확히 써야 됨(https와 서브 도메인도 다 틀리게 인식 됨)


IE8 이상에서만 되나 jqueryPostMessage 이용시 IE6 이상도 가능

'기타 > 프로그래밍 관련' 카테고리의 다른 글

JavaScript에서 이벤트 전파를 중단하는 네가지 방법  (0) 2018.04.12
PHPMailer 설정  (0) 2017.12.04
Image map area view  (0) 2015.03.04
IE console 관련 처리  (0) 2015.02.05
sample.js 파일 javaScript 규칙  (0) 2015.01.09