iFrame Resizer导致iframe高度无限增长问题求助

我之前也碰到过类似的iframe高度无限膨胀的问题，结合你的代码和日志来看，大概率是几个细节配置出了问题，咱们一步步来排查解决：

1. 修正checkOrigin的参数类型 #

你配置里写的checkOrigin: 'false'是个坑——这里必须用布尔值false，而不是字符串'false'。字符串类型的参数会被插件误判为合法的源校验规则，导致跨域校验逻辑混乱，进而触发重复的高度调整请求，形成死循环。

修改后的JS代码：

$(document).ready(function() { 
  $('#odbFrame').iFrameResize({ 
    resizeFrom: 'child', 
    checkOrigin: false // 去掉引号，用布尔值
  }); 
});

2. 移除iframe的固定高度CSS #

你给#odbFrame加了height: 100%;，这会和iFrame Resizer的自动高度计算直接冲突。插件会根据子页面内容动态设置iframe高度，而CSS的100%高度会让浏览器重新计算布局，反过来又触发插件的高度调整，形成无限循环。

修改后的CSS：

.container-fluid { padding: 0 !important; }
#odbFrame { border: 0; width: 100%; /* 移除height: 100%; */ }

3. 别忘了给子页面加Child脚本 #

你只在父页面引入了主脚本，但子页面（也就是{$odbUrl|esc}指向的页面）必须引入对应的child脚本，否则父页面无法准确获取子页面的真实高度，会不断重复计算调整。

在子页面的底部添加这段脚本：

<script src="https://cdn.jsdelivr.net/npm/iframe-resizer@4.3.2/js/iframeResizer.contentWindow.min.js"></script>

（你也可以下载对应版本的脚本到本地引入，确保和父页面的插件版本一致）

额外排查小技巧 #

如果上面的修改后还是有问题，可以试试这两个方向：

• 子页面有动态加载内容（比如图片、异步组件）的话，开启插件的waitForLoad参数，等待所有资源加载完成再计算高度：

  $('#odbFrame').iFrameResize({ 
    resizeFrom: 'child', 
    checkOrigin: false,
    waitForLoad: true
  }); 
  

• 检查子页面的html和body标签有没有默认的margin/padding，这些会导致高度计算误差，可以重置一下：

  html, body { margin: 0; padding: 0; overflow: hidden; }
  

内容的提问来源于stack exchange，提问作者PrinzJuliano