在 iFrame 中显示 YouTube 视频

Posted 2023-02-24

【中文标题】在 iFrame 中显示 YouTube 视频

【英文标题】：Showing YouTube videos in an iFrame

【发布时间】：2018-02-12 05:55:39

【问题描述】：

我想通过我页面上的 iFrame 显示 YouTube 视频，但如果我将 iFrame src 设置为 YouTube URL，我会被阻止，因为 X-Frames-Options 设置为 sameorigin。我确实找到了一个有效的 YouTube 视频。如果我将 iFrame src 设置为 https://www.youtube.com/embed/LSHuGxB3tTU 它可以正常播放。关键似乎是 embed/ 目录。是否所有 YouTube 视频在 embed/ 目录中都有我可以提取和显示的版本？我在 YouTube 页面的视频设置中没有看到任何提及 embed/ 的内容。

感谢您的任何想法。

【问题讨论】：

Embedding youtube video "Refused to display document because display forbidden by X-Frame-Options"的可能重复

【参考方案1】：

“如果我将 iFrame src 设置为 https://www.youtube.com/embed/LSHuGxB3tTU，它可以正常播放。关键似乎是 embed/ 目录”

在另一个中嵌入 Youtube 视频的全部意义在于 iFrames 用于显示其播放器界面（并运行其支持代码）。这是通过使用 iFrame 访问可嵌入播放器/代码来完成的。

转到任何 Youtube 视频并点击 SHARE。

在共享选项中，单击 EMBED，它会生成 iFrame 代码以复制/粘贴到您的网站上。

“是否所有 YouTube 视频的 embed/ 目录中都有我可以提取和显示的版本？”

是的，每个 Youtube 视频上传都会自动生成一个嵌入链接，就像视频部分具有从输入尺寸向下自动生成的多个分辨率一样（示例：高度为 360 的视频也生成240 和144 大小的视频）。

获取嵌入 URL（可在 iFrame 中使用）：

使用：https://www.youtube.com/embed/，后跟VIDEO_ID。

例子：

以https://www.youtube.com/watch?v=wJOfJdWGPMk.

哪里VIDEO_ID = wJOfJdWGPMk。

iFrame / Embed URL 是：https://www.youtube.com/embed/wJOfJdWGPMk