iframe跨域高度自适应实现（iFrame-resizer方式）

日常工作中难免会有嵌套第三方平台页面到系统中的需求，目前简便的方式无非使用 “ifream”，其中iframe高度自适应问题，同域还好说，跨域情况下，父页面没有办法操作子页面，想要正确获取子页面高度的话，可以采用以下办法：

iFrame Resizer插件

1. 下载 iframe-resizer 插件（传送门）

2. 解压 压缩包，找到文件夹中红线标注js

3.将 iframeResizer.min.js 引入调用方页面（自己的页面），并增加配置代码（直接粘贴即可，无需改动）

<!-- scrolling="no" 为了保证兼容性  无需设置height -->
<iframe src="被调用方地址（第三方平台地址）" frameborder="0" id="iframe" scrolling="no" width="100%"></iframe> 
<!-- 注意：iframeResizer.min.js依赖jQuery库，必须放在 jQuery引用后 --> 
<script src="./iframeResizer.min.js"></script>
<script type="text/javascript">
	<!-- 无需改动直接复制即可 -->
    iFrameResize({
     
		    log: true,//开启日志：插件调用过程中相关信息 
		    heightCalculationMethod:'bodyOffset',
		    //注意：ifream高度计算方式，若返回ifream高度固定为150px或0px时，请自己灵活调整计算方式(具体设置请点击传送门进入官网查看)，博主在使用过程中就碰到了该问题，查阅好久资料才得到解决。
		});
</script>

4. 将 iframeResizer.contentWindow.min.js引入被调用方（第三方平台页面）无需增加其他配置

<!-- 注意：iframeResizer.contentWindow.min.js依赖jQuery库，必须放在 jQuery引用后 -->
<script src="./iframeResizer.contentWindow.min.js"></script>

相信按照上述流程配置后，完成iframe高度自适应问题已经基本解决，若在调用中相关问题可评论交流。

参考链接：https://www.cnblogs.com/espcms/p/7445400.html
https://www.cnblogs.com/huoxiao/p/10368557.html