只使用普通的YouTube网址“嵌入”

Posted 2021-04-26

我想知道是否有可能用html实现YouTube视频 - 我不想点击“分享”和“嵌入”在YouTube上获取链接。相反，我想要它，以便我可以复制网址。

例如，而不是这个链接https://www.youtube.com/embed/09m0B8RRiEE，

我希望有这个链接https://www.youtube.com/watch?v=09m0B8RRiEE

目的是让我可以拥有一个平台，用户可以无缝地复制粘贴，而无需处理不必要的额外点击 - 就像你可以在Facebook上做的那样。

任何帮助将非常感激！

答案

https://www.youtube.com/watch?v=09m0B8RRiEE在标题中有x-frame-options:SAMEORIGIN。所以你不能只是通过iframe将它嵌入你的网站。

您可以在设置为iframe的src之前使用javascript将其转换为/watch?v=，或者使服务器（作为代理）手动重定向URL，而不是嵌入/embed/ URL。

更新：重定向演示：

HTML（使用data属性）：

<iframe data-src="https://www.youtube.com/watch?v=09m0B8RRiEE" />

JS（jQuery）：

$('iframe').each(function () {
  let originalSrc = $(this).data('src')
  let src = originalSrc.replace('/watch?v=', '/embed/')
  $(this).attr('src', src)
})