Как получить высоту кросс-домена iframe - PullRequest
Новая
       4

Как получить высоту кросс-домена iframe

6 голосов
/ 22 ноября 2011

У меня есть iframe (кросс-домен) с src из facebook, твиттера и т. Д. Мне нужно получить высоту iframe, но у меня возникла проблема: «В доступе к свойству« документ »отказано в доступе». Пожалуйста, помогите мне решить эту проблему. Большое спасибо!

Ответы [ 2 ]

10 голосов
/ 22 ноября 2011

Пара вопросов. Во-первых, высота iframe скорее всего не та, которую вы хотите. Я имею в виду, что это задано явно в HTML-коде страницы, которой вы управляете, и легко доступно и модифицируется любым способом Javascript. То, что вам нужно, это высота страницы внутри в фрейме. Если это так, простой ответ - вы не можете, по крайней мере, с помощью внешних служб, таких как Facebook / Twitter.

По соображениям безопасности можно легко передавать сообщения от потомка к родителю, но не от родителя к потомку, если в оба документа не встроен канал связи в ваш javascript . Существует протокол postMessage для обработки этого в современных браузерах. https://developer.mozilla.org/en/DOM/window.postMessage. Но в этом случае это совершенно бесполезно, если документ, с которым вы общаетесь, не настроен для обработки входящего сообщения postMessage, которое, насколько мне известно, часто не используется Twitter / Facebook.

Если родительский документ мог свободно общаться с дочерними элементами из разных доменов, то любой javascript мог бы эффективно выполнять любую серию команд на любом сайте, в который вы вошли как. С точки зрения безопасности это пугает и, к счастью, невозможно.

2 голосов
/ 09 ноября 2016

В javascript нет параметров для определения высоты междоменной высоты iframe, но вы можете сделать что-то подобное с помощью некоторого программирования на стороне сервера.Я использовал PHP для этого примера 

<?php
$output = file_get_contents('http://yourdomain.com');
?>
<div id='iframediv'>
    <?php echo $output; ?>
</div>

<iframe style='display:none' id='iframe' src="http://yourdomain.com" width="100%" marginwidth="0" height="100%" marginheight="0" align="top" scrolling="auto" frameborder="0" hspace="0" vspace="0"> </iframe>

<script>
if(window.attachEvent) {
    window.attachEvent('onload', iframeResizer);
} else {
    if(window.onload) {
        var curronload = window.onload;
        var newonload = function(evt) {
            curronload(evt);
            iframeResizer(evt);
        };
        window.onload = newonload;
    } else {
        window.onload = iframeResizer;
    }
}
   function iframeResizer(){
        var result = document.getElementById("iframediv").offsetHeight;

        document.getElementById("iframe").style.height = result;
        document.getElementById("iframediv").style.display = 'none';
        document.getElementById("iframe").style.display = 'inline';
    }
</script>
...