


Bagaimana untuk Mengatasi 'SecurityError: Akses Silang Asal Disekat' Apabila Menggunakan Iframes?
Jan 01, 2025 am 03:33 AMRalat Keselamatan: Akses Silang Asal Disekat
Apabila cuba menyepadukan iframe ke dalam halaman HTML anda dan mengakses elemennya menggunakan JavaScript, anda mungkin menghadapi ralat berikut:
SecurityError: Blocked a frame with origin "http://www.example.com" from accessing a cross-origin frame.
Ralat ini berpunca daripada pematuhan penyemak imbas kepada dasar asal yang sama, langkah keselamatan yang menghalang skrip daripada mengakses bingkai dengan asal yang berbeza. Asal merangkumi protokol, nama hos dan port.
Penyelesaian
Walaupun akses skrip silang asal terus dilarang, anda boleh menggunakan window.postMessage dan acara mesej yang sepadan untuk mewujudkan komunikasi antara bingkai:
Utama Halaman:
const frame = document.getElementById('your-frame-id'); frame.contentWindow.postMessage(/*any variable or object here*/, 'https://your-second-site.example');
Iframe:
window.addEventListener('message', event => { // Verify the origin to ensure it's your site if (event.origin === 'https://your-first-site.example') { // Retrieve data from event.data console.log(event.data); } });
Pendekatan ini membenarkan komunikasi dua arah antara bingkai. Hantaran mesej silang asal juga boleh digunakan pada tetingkap timbul dan tetingkap baharu lain yang dijana daripada halaman utama.
Atas ialah kandungan terperinci Bagaimana untuk Mengatasi 'SecurityError: Akses Silang Asal Disekat' Apabila Menggunakan Iframes?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Artikel Panas

Alat panas Tag

Artikel Panas

Tag artikel panas

Notepad++7.3.1
Editor kod yang mudah digunakan dan percuma

SublimeText3 versi Cina
Versi Cina, sangat mudah digunakan

Hantar Studio 13.0.1
Persekitaran pembangunan bersepadu PHP yang berkuasa

Dreamweaver CS6
Alat pembangunan web visual

SublimeText3 versi Mac
Perisian penyuntingan kod peringkat Tuhan (SublimeText3)

Topik panas

Ganti aksara rentetan dalam javascript

jQuery mendapatkan padding/margin elemen

HTTP Debugging dengan Node dan HTTP-Console

Tutorial Persediaan API Carian Google Custom
