android - Android 4.3 上的 YouTube 嵌入式播放器

Question

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

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

这只发生在 Android 上，使用 HTML5 播放器(包括 Chrome 和默认浏览器)，因为我的手机更新到 Android 4.3，之前在 4.2 上没问题。

它通过桌面 chrome 运行良好，用户代理设置为伪装 Android。

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

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

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

代码:

<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>

Answer 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
                }

            });