Shopify 嵌入式应用 iframe 高度不自适应怎么修

现象#

应用页面内容比 iframe 高，出现双层滚动条；或者内容很短但 iframe 留出大片空白。

原因#

• 没有使用 App Bridge 的自动高度能力，iframe 固定高度
• 页面内用了 height:100vh，在 iframe 里按外层视口计算
• 内容异步加载后没有重新计算高度
• 自定义了 overflow 造成滚动容器嵌套

处理步骤#

1. 使用 App Bridge 的 ui-nav / 自动 resize，确保 app-bridge.js 已加载
2. 把 100vh 改成 100% 或 min-height
3. 异步内容渲染完成后触发布局更新（改变一个高度相关属性即可）
4. 去掉页面内的 overflow: auto 主容器，让滚动交给外层

验收标准#

应用页只有一层滚动条，内容多少都能完整展示，无空白区域。