如何在 ejs 中显示 YouTube 视频

Question

我正在开发一个网络应用程序来显示 YouTube 视频。该应用程序是使用node.js 和express 开发的。所以我想在html中显示视频，它被写成ejs。 代码如下：

<li>
        <video controls="true" src="<%= problem.solution %>" autoplay="none" preload="auto" width="600" height="400">
        </video>
</li>

但是根本玩不了，有人可以给我一些想法吗？或者一些关于如何解决的材料？

Answer 1

<iframe width="1020" height="815" src= <%= g.url %> ></iframe>

这是我使用的，它作为视频的链接，您需要使用视频的嵌入链接。 要获取嵌入链接，请按共享按钮，然后您可以获得带有工作链接的 iframe 示例。

Answer 2

要将 YouTube 视频嵌入到您的 EJS 模板中，您不应使用

<video>

标签，因为 YouTube 视频不能直接作为视频文件嵌入。相反，您应该使用 YouTube 提供的 YouTube 嵌入代码。

具体操作方法如下：

<li>
    <iframe width="600" height="400" src="https://www.youtube.com/embed/<%= getYoutubeVideoId(problem.solution) %>" frameborder="0" allowfullscreen></iframe>
</li>

在此代码中，

<%= getYoutubeVideoId(problem.solution) %>

是从 YouTube URL 中提取视频 ID 的函数的占位符。

function getYoutubeVideoId(url) {
    // Example URL: https://www.youtube.com/watch?v=dQw4w9WgXcQ
    // Extract the video ID from the URL
    var video_id = url.split('v=')[1];
    var ampersandPosition = video_id.indexOf('&');
    if (ampersandPosition != -1) {
        video_id = video_id.substring(0, ampersandPosition);
    }
    return video_id;
}