Android 4.3 上的 YouTube 嵌入式播放器答案

【问题标题】：YouTube Embeded Player on Android 4.3Android 4.3 上的 YouTube 嵌入式播放器
【发布时间】：2014-02-13 22:19:15
【问题描述】：

我正在尝试将 YouTube 播放器嵌入到我的网页中，如下所示。

我遇到的问题是，播放器最初可以正常加载并播放第一个视频，但是当调用 .loadVideoById 时，播放器看起来会加载视频（视频标题文本更改），但随后卡在黑屏上玩的。

这仅发生在 Android 上，使用 HTML5 播放器（Chrome 和默认浏览器），因为我的手机更新到 Android 4.3，以前在 4.2 上很好。

它可以通过桌面 chrome 正常工作，用户代理设置为伪造 Android。

我还尝试过另外两部 Android 手机，但都遇到了完全相同的问题（都是 4.3）。使用 Google Code Playground Example Youtube Player，我也间歇性地遇到相同的行为。

如果我附加 ADB Chrome 远程调试器，我可以看到播放器卡在缓冲状态，尽管正在下载视频片段，正如预期的那样。

有没有人经历过类似的事情？或者有什么建议？

代码：

<div id="ytwrapper">
<div id="player" >
</div>
</div>
<script type="text/javascript">
var ytplayer;

2。此代码异步加载 IFrame Player API 代码。

var tag = document.createElement("script");
tag.src = "http://www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName("script")[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);

3.此函数在 API 代码下载后创建一个（和 YouTube 播放器）。

function onYouTubeIframeAPIReady() 
{
   ytplayer = new YT.Player('player', { width: 1280,
                            height: 720,
                            videoId: 'M7lc1UVf-VE',
                            frameborder:0,
                 events: 
                          {
                            "onReady": onYouTubePlayerReady,
                    "onStateChange": onytplayerStateChange,
                    "onPlaybackQualityChange": onYTQchange,
                "onError": onYTError
                      }
                          });
 }

function loadnextvid()
{
  ytplayer.loadVideoById(vids[currentvid],0, vqs[currentvid]);
}

function onYouTubePlayerReady(playerId) 
{
loadnextvid();
}
</script>

【问题讨论】：

标签： android html youtube youtube-api html5-video

【解决方案1】：

我有同样的问题。看来目前解决此问题的唯一方法是销毁并重新创建播放器实例。

我在这里找到了这个解决方案：https://code.google.com/p/gdata-issues/issues/detail?id=5273

适用于 Android 4.4、iOS7。

if (player != null) {
    player.destroy();
    player = null;
}


player = new YT.Player('divplayer', {
                width: '100%',
                height: '100%',
                videoId: video_id,

                playerVars: { 'autoplay': 0, 'playerapiid': 'ytPlayer', 'border': 0,  'hd': 1, 'version': 3, 'rel': 0, 'color' : 'red' },


                events: {
                    'onReady': onPlayerReady
                }

            });

【讨论】：