gpt4 book ai didi

youtube - 使用 video.js 包装器启用 youtube 播放

转载 作者:行者123 更新时间:2023-12-04 22:21:31 26 4
gpt4 key购买 nike

好的,所以我正在尝试 wrap/skin,一个带有 video.js 项目的 youtube 视频,以使我网站上的其他视频具有类似的外观和感觉。现在,根据您可以看到 here 的文档,因此我设置了一个标题,可以像 getting started section 一样正确播放和设置 example_video_1 的视频标签,但是当尝试使用带有 youtube 源的视频时,我有一个这个 html元素:

 <video id="example_video_1" class="video-js vjs-default-skin"
controls preload="auto" width="640" height="264"
poster="http://ec2-54-227-116-247.compute-1.amazonaws.com/models/site- templates/images/cover_img/ted_cover.jpg"
data-setup='{"techOrder": ["youtube"]}'>
<source src="http://www.youtube.com/watch?v=xYemnKEKx0c" type='video/youtube' />
</video>

现在显示了我的封面图片,但没有显示播放按钮。我在文档中遗漏了什么吗?或者我误解了文档,而 youtube 只是一个例子,我仍然需要实际编写一个 API 包装器来完成这项工作,他们刚刚将其作为示例方法进行了展示?任何帮助或见解将不胜感激!

这个问题在video-js v4发布前也有人问过 here 6 months

最佳答案

您可能在 javascript 控制台中生成错误,因为 videojs 默认不知道如何播放 youtube 视频。

该文档在我看来不正确。我在 github 存储库(文档之外)中没有看到任何知道如何播放 youtube 视频的实际代码。

听起来您链接到的问题中引用的拉取请求已被关闭,建议将其作为插件来执行 - appears to have happened

使用该插件非常简单。除了包含 video.js 脚本之外,您还将包含来自 https://github.com/eXon/videojs-youtube 的插件脚本:

<script src="js/video.js"></script>
<script src="js/media.youtube.js"></script>

您必须对视频标签进行的唯一更改是在数据设置 json 中包含 src:
<video id="example_video_1" class="video-js vjs-default-skin" controls 
preload="auto" width="640" height="264"
poster="http://ec2-54-227-116-247.compute-1.amazonaws.com/models/site-templates/images/cover_img/ted_cover.jpg"
data-setup='{"techOrder":["youtube"], "src":"http://www.youtube.com/watch?v=xYemnKEKx0c"}'>
</video>

这是一个 working example 。请注意,此示例引用了 rawgithub 插件 js,因此您当然需要下载本地副本。

我还注意到海报没有正确加载。这是插件中的一个错误,但如果您有兴趣,可以立即解决。看到这个 example

关于youtube - 使用 video.js 包装器启用 youtube 播放,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17546633/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com