通过＆＃39;消息跟踪视频事件事件

Question

我想通过iframe消息事件跟踪视频事件，但在查找有关如何执行此操作的文档时遇到问题。我知道我需要做类似这样的事情。window.addEventListener（'message'，function（message）{ //检查message.origin是否来自iframe，然后使用message.data ...}）;但不知道我是怎么从那里继续的。我需要跟踪正在公开的视频事件，如video_start，first_quartile，second_quartile，third_quartile，fourth_quartile和complete。

任何帮助或指示都将不胜感激

这是到目前为止的代码

$(function() {

    window.addEventListener('message', function(message) {
        if (!(/^https?:\/\/bla.bla.bla..com/).test(message.origin)) {
        return false;
        }
         var data = JSON.parse(message.data);

    switch (message.event) {
        case 'ready':
            onReady();
            break;

        case 'play':
            onPlay(message.data);
            break;

        case 'playProgress':
            onPlayProgress(message.data);
            break;

        case 'pause':
            onPause(message.data);
            break;

        case 'finish':
            onFinish(message.data);
            break;
    }

    function post(action, value) {
    var data = {
      method: action
    };

    if (value) {
        data.value = value;
    }

    var message = JSON.stringify(data);
    player[0].contentWindow.postMessage(message);
}


        function onPlay(data) {
            ga('send', 'event', 'Videos', 'play', 'Video Played');
            console.log('Video Played');
        }

function onPause(data) {
     ga('send', 'event', 'Videos', 'Pause', 'Video Paused');
}

function onFinish(data) {
     ga('send', 'event', 'Videos', 'Finished', 'Video Finished');
}

function onPlayProgress(data) {
    var quartile;
    if (data.percent % 25 === 0) {
        quartile = data.percent / 25;
        ga('Video Progress', {
            quartile: quartile
        })
    }
}


    });

});