Iframe 在网站上设置视频播放跟踪

我试图在一些网站上追踪不同的视频。这些视频都托管在YouTube上，我把它们嵌入了一些Joomla网站。我正在尝试为视频设置事件跟踪，以便我可以看到哪些网站正在播放哪些视频。经过大量阅读和研究，我发现我需要设置事件和youtube api。我已经尝试了很多版本，但我仍然无法触发事件。（我想）

我已经拼凑了以下“代码”并将其放在了网站上。我将视频嵌入页面并播放，但当我转到ganalytics时，事件不会被触发。我错过了什么？我可能有比我需要的更多，因为我正在拼凑它。我想知道的是网站上播放的视频

在此处输入代码

<!-- 1. The <iframe> (and video player) will replace this <div> tag. -->
<iframe id="player" type="text/html"width="853" height="480" src="https://www.youtube.com/embed/9dWmDOdtPO0?enablejsapi=1&origin=http://www.mywebsite.com"
  frameborder="0"></iframe>


    <script>
      // 2. This code loads the IFrame Player API code asynchronously.
      var tag = document.createElement('script');

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

      // 3. This function creates an <iframe> (and YouTube player)
      //    after the API code downloads.
 var player;
      function onYouTubeIframeAPIReady() {
        player = new YT.Player('player', {

          events: {
            'onReady': onPlayerReady,
            'onStateChange': onPlayerStateChange,
            'onError': onPlayerError
          }
        });
      }

// 4. The API will call this function when the video player is ready.
      function onPlayerReady(event) {
       console.log('player is ready');
      }


      // 5. The API calls this function when the player's state changes.
function onPlayerStateChange(event) {
    switch (event.data) {
     case YT.PlayerState.PLAYING:
      ga('send', 'event', 'Videos', 'playing', 'Home Page Video', 'Create Memories')
      })
      break;
    case YT.PlayerState.PAUSED:
      ga('send', 'event', 'Videos', 'paused', 'Home Page Video', 'Create Memories')
      })
      break;
    case YT.PlayerState.ENDED:
      ga('send', 'event', 'Videos', 'ended', 'Home Page Video', 'Create Memories')
      })
      break;

    };
};

    </script>

// 2. 此代码异步加载IFrame播放器API代码。
var tag=document.createElement（'script'）；
tag.src=”https://www.youtube.com/iframe_api";
var firstScriptTag=document.getElementsByTagName（'script'）[0]；
firstScriptTag.parentNode.insertBefore（标记，firstScriptTag）；
// 3. 此函数用于创建（和YouTube播放器）
//API代码下载后。
var播放器；
函数onyoutubeiframeapiredy（）{
player=新的YT.player（'player'{
活动：{
“onReady”：onPlayerReady，
“onStateChange”：onPlayerStateChange，
“onError”：OnPlayeError
}
});
}
// 4. 当视频播放器准备就绪时，API将调用此函数。
函数onPlayerReady（事件）{
console.log（'player is ready'）；
}
// 5. 当播放器的状态改变时，API调用此函数。
函数onPlayerStateChange（事件）{
开关（事件数据）{
案例YT.PlayerState.PLAYING：
ga（‘发送’、‘活动’、‘视频’、‘播放’、‘主页视频’、‘创建记忆’）
})
打破
案例YT.PlayerState.PAUSED：
ga（‘发送’、‘事件’、‘视频’、‘暂停’、‘主页视频’、‘创建记忆’）
})
打破
案例YT.PlayerState.ENDED：
ga（‘发送’、‘事件’、‘视频’、‘结束’、‘主页视频’、‘创建记忆’）
})
打破
};
};

可以肯定的是，您是否更换了

http://www.mywebsite.com

您的实际来源？我建议使用事件跟踪器正上方的

console.log（）

（就像您在

onPlayerReady（）

函数中所做的那样），以确保这些事件确实触发。关于origin参数，我发现我甚至不需要再包含它了——只要enablejsapi参数存在。