本文介绍通过跨域安全通信机制 `postmessage` 实现 iframe 高度动态适配内容的方法，解决固定宽高导致滚动条或空白的问题，适用于同域或可信跨域场景。
在 Web 开发中，iframe 常用于嵌入外部页面或动态生成的内容（如搜索结果、报表等）。但 iframe 默认无法自动感知其内部文档的高度变化——尤其是当内容由后端动态渲染、JavaScript 异步加载或响应式布局引起尺寸变动时，硬编码 height 值极易导致内容被截断（需滚动）或留白过多。
根本原因在于：iframe 的尺寸完全由父页面控制，子页面（iframe 内容）无权直接修改自身容器大小；这是浏览器同源策略与跨域安全模型的强制约束。 因此，必须借助安全的跨上下文通信机制——window.postMessage()。
✅ 推荐方案：基于 postMessage 的双向通信
该方法分为两部分：
