web-dev-qa-db-ja.com

不明なSecurityError: 'HTMLIFrameElement'から 'contentDocument'プロパティの読み取りに失敗しました:Origin "https:// localhost"でフレームをブロックしました

G +フォローボタンのクリックイベントをキャプチャしようとすると、以下の問題に直面します。

不明なSecurityError: 'HTMLIFrameElement'から 'contentDocument'プロパティの読み取りに失敗しました:Origin " https:// localhost "のフレームがOrigin " https://のフレームにアクセスするのをブロックしましたapis.google.com "。プロトコル、ドメイン、およびポートは一致する必要があります。

20

同様の議論を見つけました ncaught SecurityError: 'contentDocument'プロパティを 'HTMLIFramから読み取ることができませんでした

この問題は、ajaxを別のドメインに呼び出そうとすると発生します。SameOriginポリシーの詳細については、この記事を参照してください。

MozillaのSame Originの記事

これを修正するには、このコードを追加する必要があります

document.domain = 'yourdomain.com'

記事自体から:

ページは、いくつかの制限付きで独自のOriginを変更できます。スクリプトは、document.domainの値を現在のドメインのサブセットに設定できます。その場合、後続のOriginチェックに短いドメインが使用されます。たとえば、ドキュメント内の http://store.company.com/dir/other.html のスクリプトが次のステートメントを実行すると仮定します。

document.domain = "company.com";

そのステートメントの実行後、ページは http://company.com/dir/page.html でOriginチェックに合格します。ただし、同じ理由で、company.comはdocument.domainをothercompany.comに設定できませんでした。

ポート番号はブラウザによって個別に保持されます。 document.domain = document.domainを含むセッターを呼び出すと、ポート番号がnullで上書きされます。したがって、最初にdocument.domain = "company.com"を設定するだけではcompany.com:8080をcompany.comと通信させることはできません。ポート番号が両方ともヌルになるように、両方に設定する必要があります。

5
Jonast92

私のソリューションはiframeを再構築し、角度で使用可能です。 iframeを構築する場合、iframeコンテンツを変更するにはOriginセキュリティチェックが必要です。このソリューションにより、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