Я изменяю размер своего iframe в зависимости от размера загружаемого контента. Я получил решение здесь: Установка высоты iframe для scrollHeight в ReactJS
export default class WrappedFrame extends Component {
state = { contentHeight: 100 };
handleResize = () => {
const { body, documentElement } = this.container.contentWindow.document;
const maxHeight = 1024;
const contentHeight = Math.min(Math.max(
body.clientHeight,
body.offsetHeight,
body.scrollHeight,
documentElement.clientHeight,
documentElement.offsetHeight,
documentElement.scrollHeight
), maxHeight);
if (contentHeight !== this.state.contentHeight) this.setState({ contentHeight });
};
onLoad = () => {
this.container.contentWindow.addEventListener('resize', this.handleResize);
this.handleResize();
}
componentWillUnmount() {
this.container.contentWindow.removeEventListener('resize', this.handleResize);
}
render() {
const { contentHeight } = this.state;
return (
<iframe
onLoad={this.onLoad}
ref={(container) => { this.container = container; }}
srcDoc={this.props.srcDoc}
style={{ width: '100%', height: `${contentHeight}px` }}
title={this.props.title}
sandbox="allow-same-origin"
/>
);
}
}
srcDo c - это HTML электронное письмо.
One из этих писем содержится скрипт, который перенаправляет 20 раз перед возвратом png-файла 1x1px (предположительно, для отслеживания данных), который занимает 50 секунд.
В результате мой iframe рендерится с минимальным 100px, а затем через 50 секунд `` onLoad``` запускается, и iframe, наконец, изменяет размеры до определенной высоты.
Как я могу заставить iframe изменить размер до высоты содержимого прежде чем ждать разрешения всех этих перенаправлений?
Или, в идеале, сначала нужно изменить его размер после загрузки всех HTML, а затем попытаться изменить размер после завершения работы сценариев?
Или вообще отключить скрипты? Я действительно попробовал это, добавив sandbox = "allow-same-origin" в iframe.