Rumah >hujung hadapan web >tutorial js >Bagaimanakah Saya Boleh Mendayakan Komunikasi Merentas Domain Antara IFrame dan Tapak Web Induknya?

Bagaimanakah Saya Boleh Mendayakan Komunikasi Merentas Domain Antara IFrame dan Tapak Web Induknya?

Barbara Streisand
Barbara Streisandasal
2024-11-27 01:06:13310semak imbas

How Can I Enable Cross-Domain Communication Between an IFrame and Its Parent Website?

Komunikasi Merentas Domain antara iFrames dan Tapak Induk

Apabila tapak web iframe berada pada domain yang berbeza, komunikasi terus antara iframe dan tapak induk menjadi satu cabaran. Walau bagaimanapun, pemesejan silang dokumen boleh merapatkan jurang ini.

Komunikasi Ibu Bapa-ke-Iframe

Dalam tetingkap induk, anda boleh menggunakan postMessage() untuk menghantar mesej kepada tetingkap kandungan iframe:

myIframe.contentWindow.postMessage('hello', '*');

Di bahagian iframe, acara onmessage boleh menangkap dan proses mesej:

window.onmessage = function(e) {
    if (e.data == 'hello') {
        alert('It works!');
    }
};

Iframe-to-Parent Communication

Untuk menghantar mesej daripada iframe ke tetingkap induk, anda boleh menggunakan postMessage() dengan window .atas sebagai sasaran:

window.top.postMessage('hello', '*')

Dalam tetingkap induk, acara onmessage akan menerima dan memproses iframe mesej:

window.onmessage = function(e) {
    if (e.data == 'hello') {
        alert('It works!');
    }
};

Dengan menggunakan pemesejan silang dokumen, anda boleh mewujudkan komunikasi dua arah antara iframe daripada domain lain dan tapak induknya.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Mendayakan Komunikasi Merentas Domain Antara IFrame dan Tapak Web Induknya?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn