Safari/Webkit의 페이지와 동일한 도메인이있는 iframe을 어떻게 작성합니까?
-
21-08-2019 - |
문제
장면: 나는 임베드 가능한 위젯을 쓰고 있습니다. 그것은 a의 형태를 취합니다 <script>
표시하는 데 필요한 모든 것을 포함하는 iframe을 구축하는 태그. Iframe에는 없음 src
, 그리고 스크립트는 그것에 씁니다 theIframe.contentWindow.document.write()
. 위젯은 포함되어 있으며, 위젯이 포함 된 페이지와 요소 ID와 스크립트가 충돌하지 않도록합니다.
트릭: 위젯은 크기를 변경할 수 있어야합니다. 이렇게하려면 포함 된 iframe 's를 설정합니다. style.height
. 이를 위해서는 외부 페이지의 DOM에 액세스해야합니다. ~ 안에 Firefox 그리고 즉, Iframe의 문서와 외부 문서가 원점을 공유하는 것으로 간주되기 때문에 이것은 허용됩니다.
트위스트: 안에 원정 여행, 그러나 두 문서가 고려됩니다 ~ 아니다 기원을 공유합니다. 내부 문서는에있는 것으로 간주됩니다 about:blank
, 외부 문서는 다른 프로토콜과 "도메인"을 명확하게 사용하고 있지만 blank
도메인으로 간주 될 수 있습니다).
질문: 문서 Safari/WebKit을 사용하여 Window의 문서와 동일한 원점을 갖는 것을 고려하는 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에서만 작동하는지 확실하지 않습니다. 그보다 더 도움이되지 못해서 죄송합니다.