Как установить высоту iframe в соответствии с его содержимым?

Question

Я пытаюсь установить высоту iframe в React, так как прямо сейчас высота iframe по какой-то причине прокручивается, а не имеет полную высоту.

Когда я проверяю свои элементы, моя высота выглядит нормально в но в теге #document высота по какой-то причине установлена.

Я просматривал переполнение стека и обнаружил, что могу установить iframe heihgt onLoad, получив document.body.scrollheight.

Однако я могу распечатать документ, но когда я получаю document.body, я получаю undefined. Мой код внизу.

Как мне это исправить? или есть лучший способ установить высоту ifram на его конус tnet?

 resizeIframe = () => {
        var iFrameID = document.getElementById('iframeThreadBody');
        if(iFrameID) {
            //console.log(iFrameID.contentWindow.document); works
           //console.log(iFrameID.contentWindow.document.body); undefined
           iheight = iFrameID.contentWindow.document.body.scrollheight + 'px';
           iFrameID.height = iheight;
           //iFrameID.height = 500 +'px'; //also for some reason this doesnt work either.
        }
}
render(){
  return(
   //random code
   <iframe
      id = "iframeThreadBody"
     title = "threadBody"
     className = "iframeBody"
     srcDoc = {this.state.description}
     onLoad = {this.resizeIframe(this)}/>
   //code
)
}

Любая помощь будет оценена

Answer 1

Ваш сценарий может получить доступ только к iframe DOM содержимого в том же домене. Доступ к другим источникам запрещен из соображений безопасности. По крайней мере, напрямую, поскольку у вас все еще есть один хороший способ сделать это: стандартный postMessage API . При условии, что у вас также есть контроль над целевым доменом, в противном случае вам не повезло, извините. используйте postMessage для передачи этой информации на хост iframe, который прослушивает событие message. Затем хост устанавливает высоту iframe соответственно. Это не очень сложно сделать, у него отличная поддержка браузера, и он очень быстрый (связь осуществляется внутри вашего компьютера, а не в сеть).