web-dev-qa-db-fra.com

SecurityError non interceptée: échec de lecture de la propriété 'contentDocument' de 'HTMLIFrameElement': blocage d'un cadre avec l'origine "https: // localhost"

Je fais face au problème ci-dessous lorsque j'essaie de capturer les événements de clic du bouton de suivi G +.

SecurityError non capturée: échec de lecture de la propriété 'contentDocument' de 'HTMLIFrameElement': blocage d'un cadre avec Origin " https: // localhost " contre l'accès à un cadre avec Origin " https: // apis.google.com ". Les protocoles, les domaines et les ports doivent correspondre.

javascriptsecurityexception
20
Surendhar Natarajan

J'ai trouvé une discussion similaire, ncaught SecurityError: Impossible de lire la propriété 'contentDocument' de 'HTMLIFram .

Ce problème s'est déclenché lorsque vous essayez d'appeler ajax vers un autre domaine, veuillez consulter cet article pour plus d'informations sur la politique de la même origine

article Même origine de Mozilla

Pour résoudre ce problème, vous devrez ajouter ce code

document.domain = 'yourdomain.com'

De l'article lui-même:

Une page peut changer sa propre origine avec certaines limitations. Un script peut définir la valeur de document.domain sur un sous-ensemble du domaine actuel. Si tel est le cas, le domaine le plus court est utilisé pour les vérifications d'origine suivantes. Par exemple, supposons qu'un script dans le document à http://store.company.com/dir/other.html exécute l'instruction suivante:

document.domain = "company.com";

Après l'exécution de cette instruction, la page passerait la vérification d'origine avec http://company.com/dir/page.html . Cependant, selon le même raisonnement, company.com n'a pas pu définir document.domain sur othercompany.com.

Le numéro de port est conservé séparément par le navigateur. Tout appel au setter, y compris document.domain = document.domain, entraîne le remplacement du numéro de port par null. Par conséquent, on ne peut pas faire parler company.com:8080 à company.com en définissant uniquement document.domain = "company.com" dans le premier. Il doit être défini dans les deux afin que les numéros de port soient tous deux nuls.

5
Jonast92

Ma solution reconstruit l'iframe et utilisable en angulaire. Lorsque nous construisons un iframe, il nécessite un contrôle de sécurité d'origine pour modifier le contenu de l'iframe. Cette solution nous permet de recréer plusieurs fois le contenu iframe.

HTML

<div id="iframecontainer"></div>

JS

var content = "<h1>Content inside Iframe</h1>"; //desired content of iframe
var iframecontainer = document.getElementById("iframecontainer");
iframecontainer.innerHTML ='<iframe id="threedsframe" width="%90" height="400px"></iframe>';
var iframe = iframecontainer.childNodes[0];
let doc =  iframe.contentDocument || iframe.contentWindow;
doc.open();
doc.write(content);
doc.close();
0
Ebru Yener