JavaScript-Fehler "Zugriff verweigert" beim Versuch, auf das Dokumentobjekt eines programmgesteuert erstellten <iframe> zuzugreifen (nur IE)

Ich habe ein Projekt, in dem ich ein <iframe> -Element mit JavaScript erstellen und an das DOM anhängen muss. Danach muss ich etwas Inhalt in den <iframe> einfügen. Es ist ein Widget, das in Websites von Drittanbietern eingebettet wird.

Ich habe das Attribut "src" von <iframe> nicht festgelegt, da ich keine Seite laden möchte. Vielmehr wird es verwendet, um den Inhalt, den ich darin einfüge, zu isolieren bzw. in eine Sandbox zu verschieben, damit keine CSS- oder JavaScript-Konflikte mit der übergeordneten Seite auftreten. Ich verwende JSONP, um HTML-Inhalte von einem Server zu laden und in diesen <iframe> einzufügen.

Ich habe dies gut funktioniert, mit einer schwerwiegenden Ausnahme - wenn die document.domain-Eigenschaft auf der übergeordneten Seite (die es in bestimmten Umgebungen sein kann, in denen dieses Widget bereitgestellt wird), Internet Explorer (wahrscheinlich alle Versionen, aber ich habe bestätigt in 6, 7 und 8) gibt mir einen Fehler "Zugriff verweigert", wenn ich versuche, auf das Dokumentobjekt dieses <iframe> zuzugreifen, das ich erstellt habe. In keinem anderen Browser, in dem ich getestet habe (allen gängigen modernen Browsern), ist dies der Fall.

Dies ist sinnvoll, da ich weiß, dass Sie in Internet Explorer die document.domain aller Fenster / Frames festlegen müssen, die miteinander kommunizieren, und zwar auf denselben Wert. Mir ist jedoch keine Möglichkeit bekannt, diesen Wert für ein Dokument festzulegen, auf das ich nicht zugreifen kann.

Kennt jemand eine Möglichkeit, dies zu tun - irgendwie die document.domain-Eigenschaft dieses dynamisch erstellten <iframe> festlegen? Oder sehe ich es nicht aus der richtigen Perspektive - gibt es einen anderen Weg, um das zu erreichen, was ich anstrebe, ohne auf dieses Problem zu stoßen? Ich muss auf jeden Fall einen <iframe> verwenden, da das isolierte / Sandbox-Fenster für die Funktionalität dieses Widgets von entscheidender Bedeutung ist.

Hier ist mein Testcode:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>Document.domain Test</title>
    <script type="text/javascript">
      document.domain = 'onespot.com'; // set the page's document.domain
    </script>
  </head>
  <body>
    <p>This is a paragraph above the &lt;iframe&gt;.</p>
    <div id="placeholder"></div>
    <p>This is a paragraph below the &lt;iframe&gt;.</p>
    <script type="text/javascript">
      var iframe = document.createElement('iframe'), doc; // create <iframe> element
      document.getElementById('placeholder').appendChild(iframe); // append <iframe> element to the placeholder element
      setTimeout(function() { // set a timeout to give browsers a chance to recognize the <iframe>
        doc = iframe.contentWindow || iframe.contentDocument; // get a handle on the <iframe> document
        alert(doc);
        if (doc.document) { // HEREIN LIES THE PROBLEM
          doc = doc.document;
        }
        doc.body.innerHTML = '<h1>Hello!</h1>'; // add an element
      }, 10);
    </script>
  </body>
</html>

Ich habe es gehostet bei:

http://troy.onespot.com/static/access_denied.html

Wie Sie sehen werden, wenn Sie diese Seite im IE laden, habe ich an dem Punkt, an dem ich alert () aufrufe, ein Handle für das Fensterobjekt des <iframe>. Ich kann einfach nicht tiefer in das Dokumentobjekt eindringen.

Vielen Dank für jede Hilfe oder Anregungen! Ich bin jemandem zu Dank verpflichtet, der mir dabei helfen kann, eine Lösung zu finden.

Antworten auf die Frage(11)

Ihre Antwort auf die Frage