Question

我已经尝试了将youtube视频嵌入到HTML5中的所有方法，但它无法在任何浏览器中使用。我得到的最好的是一个说广告无法找到的广场。我尝试过使用旧的嵌入代码，我尝试过使用iframe ...我也尝试过使用新的视频标签......我已将每个代码转储到自己独立的部分（意思不是包含在一个div或类似的东西中）...它所包含的唯一内容就是身体本身......我也尝试过将所有这三种方法放在某种容器中，就像div一样。不是在一个或不在一个应该影响它的可玩性，但我正在尝试一切...我不明白为什么它不会工作

Answer 1

你没有展示你尝试过的不起作用的东西，但我今天感觉很精神，所以这是一个狂野的刺：

YouTube目前正在发布嵌入式链接，如下所示：

<iframe width="640" height="360"      
  src="//www.youtube.com/embed/sLAEg5aTXAE?feature=player_detailpage"
  frameborder="0" allowfullscreen></iframe>

这有什么不寻常之处在于 - 在IFrame标签的“src”属性中的URL - 没有指定协议。

上面的src属性的格式是一种相对URL，称为协议相对URL ，它允许embed标记工作，无论您的页面是否使用http访问： //或https：//协议。（不允许在一页中混合使用这些内容）

然而 - 我猜这是你出错的地方 - 如果你在本地打开一个HTML5文件，而不是通过网络服务器，它有一个file：// URL。因为相对URL（包括这个奇怪的协议相对URL）总是从当前页面位置获取未指定的位，所以计算的完整URL无效：

文件：//www.youtube.com/embed/sLAEg5aTXAE特征= player_detailpage

要修复，只需更改src属性以指定协议，将相对URL更改为绝对URL，该URL适用于同时使用file：//和http：//协议的页面。

<iframe width="640" height="360"      
  src="http://www.youtube.com/embed/sLAEg5aTXAE?feature=player_detailpage"
  frameborder="0" allowfullscreen></iframe>

缺点是您无法将其放在通过https传送的页面上。

从长远来看，您应该养成从真实的Web服务器而不是文件URL进行测试的习惯。对于本地安装的测试服务器，WAMP / MAMP是一个简单而流行的选择。

将来自youtube的视频嵌入HTML5

1 个答案: