iframe上的youtube不起作用

我试图将youtube包含在iframe中，但它看起来是空白的。这是我正在与核对的代码

<!DOCTYPE html>
<html>
<body>
<iframe src="http://www.youtube.com">
<p>Your browser does not support iframes.</p>
</iframe>
</body>
</html>

为什么会发生这种情况？我该怎么做才能让它发挥作用？

检查您的控制台。它很可能会有这样的信息：

拒绝显示'https://www.youtube.com/'，因为它将"X-frame-Options"设置为"SAMEORIGIN"

点击此处阅读更多关于X-Frame-Options:

X-Frame-Options响应标头

X-Frame-Options HTTP响应标头可用于指示是否应允许浏览器在<frame>、<iframe>或<object>中呈现页面。网站可以通过确保其内容不会嵌入其他网站来避免点击劫持攻击。

[…]

SAMEORIGIN

页面只能显示在与页面本身相同原点的框架中。

[…]

换句话说，[…]如果指定SAMEORIGIN，则只要框架中包含该页面的站点与为该页面提供服务的站点相同，就仍然可以在框架中使用该页面。

长话短说：Youtube不希望你嵌入他们的网站（注意：我在这里说的是网页，而不是视频！），并明确设置HTTP标头来与浏览器通信。

如果你想显示/嵌入视频，请使用共享»嵌入下每个视频下面的代码。

<iframe width="1280" height="720" 
        src="https://www.youtube.com/embed/dQw4w9WgXcQ?rel=0&amp;showinfo=0"
        frameborder="0" allowfullscreen>
</iframe>

你可以试试这个：

<!DOCTYPE html>
<html>
<body>
<iframe allowfullscreen="true" src="http://www.youtube.com/embed/c0MZ2bTtBm0?autoplay=1&amp;autoplay=1" style="width: 100%; height: 100%; opacity: 1; display: block;" class="ms-slide-video"></iframe>
</body>
</html>

相关内容

最新更新

热门标签：