Safari/WebKit のページと同じドメインで iframe を構築するにはどうすればよいですか?
-
21-08-2019 - |
質問
シーン:埋め込み可能なウィジェットを作成しています。それは次のような形をとります <script>
タグ。表示する必要があるものすべてを含む iframe を構築します。iframeには何もありません src
, 、そしてスクリプトはそれに書き込みます theIframe.contentWindow.document.write()
. 。これにより、ウィジェットが含まれた状態が維持され、要素 ID とスクリプトがウィジェットが埋め込まれているページと競合することがなくなります。
トリック:ウィジェットはサイズを変更できる必要があります。これを行うには、それを含む iframe を設定します。 style.height
. 。これには、外側のページの DOM へのアクセスが必要です。で Firefox そして IE, 、iframe のドキュメントと外側のドキュメントは原点を共有しているとみなされるため、これは許可されます。
ひねり:で サファリ, ただし、2 つの文書は考慮されます。 ない 原点を共有すること。内部ドキュメントは次の場所にあるとみなされます。 about:blank
, 一方、外側のドキュメントは明らかに異なるプロトコルと「ドメイン」を使用しています ( blank
ドメインとみなすことができます)。
質問:Safari/WebKit がそのドキュメントを作成しているウィンドウのドキュメントと同じオリジンを持つと見なす iframe をプログラムで構築するにはどうすればよいですか?
編集:さらに実験を行った結果、位置が異なる iframe をプログラムで作成する方法が見つかりません。 about:blank
内容を変更するかどうかは関係ありません。
でフレームを作成すると、 document.createElement()
, 、それを与えてください src
これは、「foo.html」という同じオリジン上の実際の HTML リソースを指します。 document.body.appendChild()
この場合、Safari のコンソールには DOM 内の要素が期待どおりに表示されますが、ページのコンテンツは表示されず、ドキュメントはサイドバーに「about:blank」としてリストされます。
iframe の HTML をページに直接含めると、 foo.html
が表示され、サイドバーに「foo.html」が表示されます。
を使用してHTMLを挿入すると、 document.write()
, と同じ結果が得られます document.body.appendChild()
.
どちらのプログラム版も Firefox で動作します。
解決 2
ああ。これは WebKit のバグのようです。iframe がプログラムで作成されると、 src
属性は無視されます。代わりに、フレームのデフォルトは次のとおりです。 about:blank
また、他の場所を指す URL にリダイレクトされる必要があります。例えば:
theIframe.contentWindow.location = theIframe.src
他のヒント
私ができる最善の提案は、iframe を同じサーバー上の空白のページ (つまり、blank.html) に設定してから、コンテンツを編集することです。お尻が痛いのはわかりますが、それは回避策です。
試してみることもできます
iframe.contentDocument.open("replace");
iframe.contentDocument.write("<b>This is some content</b>");
iframe.contentDocument.close();
ただし、それが IE でのみ機能するかどうかはわかりません。申し訳ありませんが、それ以上のお役に立てませんでした。