"Acesso negado" Erro de JavaScript ao tentar acessar o objeto de documento de um <iframe> programaticamente criado (somente IE)

Eu tenho projeto em que preciso criar um elemento <iframe> usando JavaScript e anexá-lo ao DOM. Depois disso, preciso inserir algum conteúdo no <iframe>. É um widget que será incorporado em sites de terceiros.

Não defino o atributo "src" do <iframe>, pois não quero carregar uma página; em vez disso, ele é usado para isolar / sandbox o conteúdo que eu insiro nele para que eu não entre em conflitos de CSS ou JavaScript com a página pai. Estou usando o JSONP para carregar algum conteúdo HTML de um servidor e inseri-lo neste <iframe>.

Eu tenho esta funcionando bem, com uma grave exceção - se o document.domain propriedade é definida na página pai (que pode ser em determinados ambientes em que este widget é implantado), o Internet Explorer (provavelmente todas as versões, mas eu tenho confirmado em 6, 7 e 8) me dá um erro "Acesso negado" quando tento acessar o objeto de documento deste <iframe> que criei. Isso não acontece em nenhum outro navegador que eu testei (todos os grandes e modernos).

Isso faz algum sentido, já que estou ciente de que o Internet Explorer exige que você defina o document.domain de todas as janelas / quadros que se comunicarão entre si com o mesmo valor. No entanto, não conheço nenhuma maneira de definir esse valor em um documento que não posso acessar.

Alguém está ciente de uma maneira de fazer isso - de alguma forma, definir a propriedade document.domain deste <iframe> dinamicamente criado? Ou não estou olhando para ele do ângulo certo - existe outra maneira de alcançar o que estou procurando sem me deparar com esse problema? Eu preciso usar um <iframe> em qualquer caso, como a janela isolada / sandbox é crucial para a funcionalidade deste widget.

Aqui está o meu código de teste:

<!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>

Eu hospedei em:

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

Como você verá se você carregar esta página no IE, no ponto que eu chamo alert (), eu tenho um identificador no objeto de janela do <iframe>; Eu não consigo me aprofundar mais em seu objeto de documento.

Muito obrigado por qualquer ajuda ou sugestão! Ficarei em dívida com quem puder me ajudar a encontrar uma solução para isso.

questionAnswers(11)

yourAnswerToTheQuestion