获得Facebook嵌入的iframe视频和帖子高度

Get Facebook Embedded iframe video and post height

本文关键字：高度 视频 iframe Facebook 获得      更新时间：2023-09-26

我试图在我的网页上获得嵌入的facebook视频和帖子的iframe高度。因为我嵌入了很多不同的帖子和视频，我只有指定iframe的宽度，但不是高度。像下面的代码:

视频:

<iframe src="https://www.facebook.com/plugins/video.php?href=https%3A%2F%2Fwww.facebook.com%2Fbbcnews%2Fvideos%2F10153836161582217%2F&show_text=1&width=560" width="560" style="border:none;overflow:hidden" scrolling="no" frameborder="0" allowTransparency="true"></iframe>
文章

: 

<iframe src="https://www.facebook.com/plugins/post.php?href=https%3A%2F%2Fwww.facebook.com%2F9gag%2Fposts%2F10154878302591840&width=500" width="500" style="border:none;overflow:hidden" scrolling="no" frameborder="0" allowTransparency="true"></iframe>

现在，如果我只指定宽度，我得到了一个被切成两半的框架。视频示例

我的问题是，是否有一种方法来获得内容的高度后，内容已经呈现为嵌入的视频和帖子。有javascript的方法吗?或者可能是我可以使用的API调用?

谢谢。

如果iframe的内容在不同的域中，则无法访问其内部。这将是跨站点脚本。

所以最好的解决方案是在你的iframe的src属性的查询字符串中传递height，并从它的父框架中获得iframe的高度。

在下面的示例

: 

var elm = document.getElementById('iframeFb');
console.log('iframe height is: ', elm.height);
<iframe id="iframeFb" src="https://www.facebook.com/plugins/video.php?href=https%3A%2F%2Fwww.facebook.com%2Fbbcnews%2Fvideos%2F10153836161582217%2F&show_text=1&width=560" width="560" height="315" style="border:none;overflow:hidden" scrolling="no" frameborder="0" allowTransparency="true"></iframe>

相关文章：