JavaScript를 사용하여 브라우저 창 간 통신을 활성화하는 방법

JavaScript의 postMessage API는 서로 다른 창 또는 iframe 간의 출처 간 통신을 안전하게 활성화하기 위한 강력한 도구입니다. 일반적으로 상위 구성 요소와 내장된 iframe 간에 데이터를 교환하는 데 사용되므로 문서의 출처가 다른 경우에도 제어된 상호 작용이 가능합니다.

다음은 postMessage를 사용하여 iframe과 상위 구성 요소 간에 데이터를 보내는 실제 예입니다.

// Parent Component
const iframe = document.getElementById("myIframe");

// Send a message to the iframe
iframe.contentWindow.postMessage("Hello from parent", "https://iframe-domain.here");

// Listen the message
window.addEventListener("message", (event) => {
    if (event.origin === "https://iframe-domain.here") {
        console.log("Message from iframe:", event.data);
    }
}, false);


// Iframe Component
// Send a message to the parent
window.parent.postMessage("Hello from iframe", "https://parent-domain.here");

위 내용은 JavaScript를 사용하여 브라우저 창 간 통신을 활성화하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!