Youtube IFrame API playVideo() 错误

Question

Youtube 的 IFrame API 不再适合我了。 onYouTubeIframeAPIReady() 和 onYouTubePlayerReady() 都被执行。但是，当尝试 loading/playing 视频时，我收到以下错误：

base.js:2575 Uncaught TypeError: Cannot read property 'g' of null
    at jL (base.js:2575)
    at nL (base.js:2567)
    at PU.g.h.nh (base.js:5853)
    at E0 (base.js:3841)
    at q1.g.h.Lr (base.js:6904)
    at q1.g.h.Dy (base.js:6905)
    at r1 (base.js:3909)
    at L1.g.h.Vn (base.js:6937)
    at L1.g.h.nN (base.js:6679)
    at g.bD.g.h.V (base.js:5529)

以下是我如何使用 IFrame API

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

// Create YouTube Player
var jukeBoxYoutubePlayer;
function onYouTubeIframeAPIReady() {
    console.log("iframe api ready");

    jukeBoxYoutubePlayer = new YT.Player('youtube_player', {
        height: '400px',
        width: '400px',
        events: {
            'onReady': onYouTubePlayerReady
        }
    });
}

// On Ready Event
function onYouTubePlayerReady(event) {
    console.log("player ready");

    jukeBoxYoutubePlayer.unMute();
    jukeBoxYoutubePlayer.setVolume(75);
}

以下是我加载和播放视频的方式：

jukeBoxYoutubePlayer.loadVideoById("ubtbkgUmHHE", 0, "large");
jukeBoxYoutubePlayer.playVideo();

我不明白为什么我的代码不起作用。它已经工作了几个月。我还重新检查了文档 (https://developers.google.com/youtube/iframe_api_reference) 是否有任何新更改，但找不到任何内容。

Answer 1

问题似乎是我的 "youtube_player" iframe 被 CSS display:none 隐藏了。显然，YouTube 要求 iframe 可见。但是，将 iframe 调整为 1x1 像素为我解决了这个问题。

Youtube IFrame API playVideo() 错误

Youtube IFrame API playVideo() Error

javascript

youtube-api

youtube-iframe-api