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

Question

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

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

自从将我的手机更新到 Android 4.3 后，这种情况仅在使用 HTML5 播放器(Chrome 和默认浏览器)的 Android 上发生，之前在 4.2 上表现良好。

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

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

如果我连接 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
                }

            });