Warum erhält mein JavaScript-Code beim Zugriff auf einen IFrame den Fehler „SecurityError: Frame mit Ursprung blockiert ...'?

Blockierter Cross-Origin-Frame-Zugriff: Grundlegendes zu SecurityError

Bei der Webentwicklung, wenn versucht wird, auf Elemente innerhalb eines Iframes zuzugreifen, der ein Anderer Ursprung als das übergeordnete Dokument, Entwickler können auf den folgenden Fehler stoßen:

SecurityError: Blocked a frame with origin "http://www.example.com" from accessing a cross-origin frame.

Dieser Fehler tritt aufgrund auf auf die Same-Origin-Richtlinie, die von Webbrowsern implementiert wird.

Same-Origin-Richtlinie

Die Same-Origin-Richtlinie verhindert, dass Skripte auf Ressourcen von Websites mit unterschiedlichem Ursprung zugreifen um mögliche Sicherheitslücken zu verhindern. Ursprung bezieht sich auf die Kombination aus Protokoll, Hostname und Port einer URL.

Betrachten Sie die folgenden Beispiele:

• http://www.example.com/home /index.html kann auf Ressourcen in http://www.example.com/home/other.html zugreifen und http://www.example.com:80.
• https://google.com/search?q=james bond kann nicht auf Ressourcen von http://www.example.com/home/index.html.

Problemumgehung für den Zugriff auf Cross-Origin-Frames

Obwohl der direkte JavaScript-Zugriff auf Cross-Origin-Frames verboten ist, gibt es Workarounds zum Datenaustausch:

• window.postMessage (): Ermöglicht die kontrollierte Nachrichtenübermittlung zwischen zwei unterschiedlichen Fenstern Ursprünge.
• postMessage() Listener im Iframe: Hört auf Nachrichten, die vom übergeordneten Dokument gesendet werden.

// In the main page:
frame.contentWindow.postMessage('message', 'https://your-second-site.example');

// In the iframe:
window.addEventListener('message', (event) => {
  if (event.origin === 'https://your-first-site.example') {
    console.log(event.data); // Received message
  }
});

Deaktivieren von Same- Ursprungsrichtlinie (Vorsicht)

Deaktivieren des Same-Origin Die Richtlinie kann für Entwicklungszwecke erstellt werden, sollte jedoch niemals in Produktionsumgebungen verwendet werden, da sie erhebliche Sicherheitsrisiken birgt. Hier finden Sie Links zu Ressourcen zum Deaktivieren der Richtlinie in verschiedenen Browsern:

[Google Chrome](https://stackoverflow.com/questions/26982875/how-to-disable-same-origin-policy )
• [Mozilla Firefox](https://superuser.com/questions/287723/temporarily-disable-same-origin-policy-in-firefox)
• [Safari](https://apple.stackexchange.com/questions /211467/how-to-disable-same-origin-policy-in-safari)

Das obige ist der detaillierte Inhalt vonWarum erhält mein JavaScript-Code beim Zugriff auf einen IFrame den Fehler „SecurityError: Frame mit Ursprung blockiert ...'?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!