YouTube 播放列表 - 更改起始视频 + 移动支持答案

【问题标题】：YouTube Playlist - Change Starting Video + Mobile SupportYouTube 播放列表 - 更改起始视频 + 移动支持
【发布时间】：2013-09-20 22:15:09
【问题描述】：

要嵌入播放列表，我使用以下 HTML 代码：

<iframe src="http://www.youtube-nocookie.com/embed/videoseries?list=PLcld7bnZTdpiTel3p6QbXKIb5i5Wontd0&autoplay=1&iv_load_policy=3&hl=de_DE" width="1280" height="720" frameborder="0" allowfullscreen></iframe>

不幸的是，没有办法开始，例如通过播放列表的指定视频 ID。 YouTube 使用播放列表 ID 后面的参数（例如 &v=60MQ3AG1c8o）来加载，例如第二个视频分享建议。有没有办法加载播放列表的特定视频。因此，例如，用户可以直接从第二个视频开始，然后继续使用常规播放列表。

如果您有更好的想法在网络应用程序上显示视频播放列表，请告诉我。

我遇到的第二个问题/问题是，在 iOS 或 Android 上无法在移动浏览器中播放 youtube 播放列表。是否有任何已知的解决方法可以在移动设备上实现这一点？

谢谢。

【问题讨论】：

标签： android ios web-applications youtube youtube-api

【解决方案1】：

我们可以将videoseries替换为开头的视频ID，比如0-7IHOXkiV8：

<iframe src="http://www.youtube-nocookie.com/embed/0-7IHOXkiV8?list=PLcld7bnZTdpiTel3p6QbXKIb5i5Wontd0&autoplay=1&iv_load_policy=3&hl=de_DE" width="1280" height="720" frameborder="0" allowfullscreen></iframe>

【讨论】：

【解决方案2】：

如果您使用完整的 YouTube 播放器 API 而不仅仅是 <iframe> 标记，则可以加载播放列表并从特定位置开始。这是一个示例 (jsfiddle version)：

var player;

function onYouTubeIframeAPIReady() {
    player = new YT.Player('player', {
        height: '390',
        width: '640',
        videoId: 'videoseries',
        events: {
            onReady: loadPlaylist
        }
    });
}

function loadPlaylist() {
    player.loadPlaylist({
        list: "PLhBgTdAWkxeCMHYCQ0uuLyhydRJGDRNo5",
        listType: "playlist",
        index: 4
    });
}

那应该工作，但不是现在；我将与 YouTube 播放器工程团队跟进，了解为什么它没有在索引为 4 的视频处开始播放。

【讨论】：

添加该函数 loadPlaylist() 在 Chrome 和 FireFox 上对我有用。它开始播放该播放列表的第 5 个视频。当播放列表索引以 0 开头时似乎是正确的。
我会试试 loadPlaylist() 函数！任何想法让它在移动 Chrome 和 Safari 上工作？
好吧，它实际上只在 HTML5 播放时出现问题。当您使用 Flash 播放时，它可以工作。它仍然需要修复。
假设我必须为此使用 ActionScript API，对吗？我该如何实际使用它？我跟着并查看了指南 (developers.google.com/youtube/flash_api_reference)，但我找不到有关在我的 HTML 模板中使用的 JS 脚本的信息。还是我只需要使用 auth.js ？如果没有，我在哪里可以获得所有其他必要的文件？谢谢！
@user2784727 上面的答案有一个工作示例的链接，名为：“jsfiddle 版本”。该示例显示通过添加以下行来包含脚本文件：

【解决方案3】：

这个答案包含另一个答案的小提琴副本，因为有些人无法打开链接。

<!DOCTYPE html>
<html>
    <head>
        <meta content="text/html;charset=utf-8" http-equiv="Content-Type">
        <title>
            YT video player
        </title>
        <script src="https://www.youtube.com/iframe_api"></script>

        <script type='text/javascript'>
var player;

function onYouTubeIframeAPIReady() {
    player = new YT.Player('player', {
        height: '390',
        width: '640',
        videoId: 'videoseries',
        events: {
            onReady: loadPlaylist
        }
    });
}

function loadPlaylist() {
    player.loadPlaylist({
        list: "PLhBgTdAWkxeCMHYCQ0uuLyhydRJGDRNo5",
        listType: "playlist",
        index: 4
    });
}
        </script>
    </head>
    <body>
          <div id="player"></div>
    </body>
</html>

【讨论】：