页面刷新后 YouTube 嵌入播放器奇怪的状态行为

Question

在刷新页面后尝试以编程方式播放视频时，YT 播放器按以下顺序更改其状态：

1. -1（未开始播放）
2. 3（缓冲）
3. -1（未开始播放）- 通常，此处播放器应将状态更改为 1（正在播放）。

视频没有开始。我做错了什么？

这是我的代码：

        var player;
    
        $(document).ready(function(){                      
            var tag = document.createElement('script');
            tag.src = "https://www.youtube.com/iframe_api";
            var firstScriptTag = document.getElementsByTagName('script')[0];
            firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
        });

        window.onYouTubeIframeAPIReady = function(){
            createPlayer();
        }
        
        function createPlayer() {
            window.YT.ready(function() {
                    player = new YT.Player('iframeContainer', {
                      width: '100%',
                      height: '100%',
                      videoId: [Youtube video ID],
                      events: {
                        'onStateChange': onPlayerStateChange,
                        'onReady': onPlayerReady
                      }
                });             
            })
        }

        function onPlayerStateChange(event) {
            alert("state changed" + event.data)
        }
        
        function onPlayerReady(event) {              
            event.target.playVideo();
            alert("play");
        }