YouTube API Event Source Detection

Question

I have a YouTube player on a webpage created using the YouTube IFrame API

When I get the onStateChange event, as in the code example:

 var player; function onYouTubeIframeAPIReady() { player = new YT.Player('player', { height: '390', width: '640', videoId: 'M7lc1UVf-VE', events: { 'onReady': onPlayerReady, 'onStateChange': onPlayerStateChange } }); 

When onPlayerStateChange is onPlayerStateChange , I would like to be able to distinguish

• The user clicked on the player’s user interface and changed the state (play, pause, etc.).
• An API call was made to change state ( player.playVideo() , player.pauseVideo() , etc.)

Currently, both results lead to an exact single event.

Answer 1

• I think you are faced with a cross-domain iframe problem.

  • Iframe cross-domain policy issue - explanation
  • Cross-domain iframe problem - solution if page and iframe page are in the same domain
  • How to track click event of embedded video (youtube, vimeo, etc.)? (to track the amount of playback) - A similar question and answer that this is not possible

• As I mentioned in my comment, there may be some useful information in the event object that is passed to event listeners. I looked at least two levels and did not find the difference between the user click action and the API call. However, there is a lot of information in the object, and possibly something that will help distinguish between the two actions.

• If your code calls API calls, perhaps you could trace this differently. Then your code could tell if the API call was called. Perhaps save the current call and timestamp - something along these lines.

• Finally, maybe there is another way to capture the information you need. Your question does not determine the ultimate goal. I would recommend exploring alternatives as a simple solution is not possible.