Как изменить высоту фрейма при изменении его содержимого?

Question

Я хотел бы изменить высоту iframe при изменении его содержимого (когда кто-то нажимает на ссылку в iframe) без прокрутки. Это означает, что iframe должен принимать нужную ему высоту на странице.

Я пытался использовать функцию onLoad , но она просто работает при первой загрузке iframe (не когда я нажимаю на внутреннюю ссылку внутри iframe).

Веб-сайт, встроенный в iframe, находится в React (это проблема?). Iframe встроен в другое доменное имя (я дал полномочия с Django CSP).

Вы знаете, как это сделать? Большое спасибо!

<iframe src="https://www.example.com" width="100%" height="200px" id="iframe" marginheight="0" frameborder="0" onload="autoResize('iframe');" ></iframe>

<script language="JavaScript">
function autoResize(id){

    var newwidth;

    if(document.getElementById){
        newheight=document.getElementById(id).contentWindow.document .body.scrollHeight;
        newwidth=document.getElementById(id).contentWindow.document .body.scrollWidth;
    }

    document.getElementById(id).height= (newheight) + "px";
    document.getElementById(id).width= (newwidth) + "px";
}

</script>

Answer 1

Однажды у меня была похожая проблема. Для фреймов не предусмотрено автоматов c для регулировки их высоты. Вам необходимо реализовать ручную форму связи изменения высоты между главной страницей (window.onmessage) и встроенной страницей (parent.postMessage). Учебник, который я использовал, был Средний: как автоматически изменить размер фрейма , и я был очень доволен им.