vimeo api - 播放事件并不总是有效，任何可能的解决方法？答案

【问题标题】：vimeo api - play-event doesn't always work, any workarounds possible?vimeo api - 播放事件并不总是有效，任何可能的解决方法？
【发布时间】：2016-02-19 14:51:02
【问题描述】：

我在 Vimeo javascript API 中发现了一个错误，并在 jsfiddle 上放了一个示例（有关链接和代码，请参见本文末尾（stackoverflow 坚持将代码与 jsfiddle 一起粘贴）

我把这件事告诉了 Vimeo，但他们从来没有告诉我他们是否可以复制这个错误，或者我是否可以使用任何解决方法。

所以我在下面发布了对问题的描述（您可以查看代码并在 jsfiddle 上运行它），如果您有任何想法（与我的错误相比，它真的是 vimeo 错误，是否有一些顺序我可以做的电话来解决这个问题）然后请告诉我。

这里是描述：

这个错误可以描述为：“播放事件只触发了它应该触发的时间的一小部分”

重现步骤：

运行 jsfiddle。视频将播放几毫秒然后停止。将弹出一个带有“play-event”字样的警报，表明该播放事件如预期的那样被触发了。
暂停视频
播放视频。
每次播放视频时，您都会看到一条警报：“播放事件已触发”。
再次暂停视频。
单击下一步按钮。这个按钮会寻找到视频中间的一个位置（其实是用了4个位置的数组，所以第一次seek到第一个位置，下次seek到第二个位置等）
视频将跳转到中间的部分。视频将开始播放。错误出现在这里。应出现指示输入“播放事件”的警报。但事实并非如此！

提示：如果您直到视频播放到几乎结束时才单击“下一步”按钮，然后单击“下一步”按钮，您可能会很幸运，“播放事件”会触发！！！！我的猜测是，当视频大部分缓存在用户计算机上时，API 会更好地工作

https://jsfiddle.net/3f9z7ffo/

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>

<script type="text/javascript" src="https://f.vimeocdn.com/js/froogaloop2.min.js"></script>


<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/themes/smoothness/jquery-ui.css" />

<script type="text/javascript">
    var globalcount = 0;
    var windowwidth = 0;

    var initialseek = true;
    var is_chrome = navigator.userAgent.toLowerCase().indexOf('chrome') > -1;
    var timeoutID;
    var stoparray = new Array("48", "103.979", "346.513", "407.459");
    var quiz = false;

    var startPosition = 0;
    var stoplength = stoparray.length;
    var stopindex = -1;
    var timeinterval = 10;
    var defaultwidth = 3;
    var gDuration;
    var gPlayer;
    var gvideowidth;
    var gvideoheight;
    var hiderank;
    var gPlayer;
    var vimeoPlayers;

</script>

<center>

    <table>
        <tr>
            <td style="width:33%;text-align:right;padding-right:14px"></td>
            <td style="width:33%">
                <div id="HoldPlayer" style="position:relative">
                    <iframe src='https://player.vimeo.com/video/152639172?autoplay=0&api=1&player_id=player1'
                            id='player1'
                            width='640' height='360'
                            frameborder='0'></iframe>
                </div>
            </td>
            <td style="width:33%"></td>
        </tr>
    </table>

    <table style="width:100%">
        <tr>
            <td style="text-align:center">
                Window (total time in seconds): <input type="text" id="windowwidth" maxlength="3" style="width: 30px;" />
                &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                <label><input type="checkbox" checked="checked" id="chkplayvid" />Play</label>
            </td>
        </tr>


    </table>

</center>


<center>
    <table>
        <tr>
            <td style="text-align:center">
                <input type="button" id="nextbutton" onclick="nextPlayer(); return (false);" value="Next" />
            </td>
        </tr>
        <tr>
            <td align="center"></td>
        </tr>


    </table>

</center>

<div id="oPara"></div>


<script type="text/javascript">


    // +++++++++++++
    function ready2() {

        setupEventListeners();
        gPlayer.api('getDuration', function (value, player_id) {
            gDuration = value; // this will be set whenever callback fires
            playVideo();
        });

    }
    // +++++++++++++
    function setupEventListeners() {
        gPlayer.addEvent('pause', pauseEvent);
        gPlayer.addEvent('finish', endEvent);
        gPlayer.addEvent('play', playEvent);
    }


    function endEvent() {
        alert("end event!!!");
        gidClearTimeout(timeoutID);
    }
    function pauseEvent() {
        alert("pauseEvent!!!");
        return;
    }
    function playEvent() {
        alert("playEvent!!!");
        globalcount = globalcount + 1;

        if (initialseek) {
            timeoutID = setTimeout(pausePlayer, 60);
            initialseek = false;
        }
        else {
            timeoutID = setTimeout(pausePlayer, windowwidth);
        }
        return;
    }


    $(document).ready(function () {


        $("#windowwidth").val(defaultwidth);
        setTimeout(addReadyEvent, 60);
    });
    // +++++++++++++
    function addReadyEvent() {

        var iframe = $('#player1')[0];
        gPlayer = $f(iframe);
        gPlayer.addEvent('ready', ready2);
    }

    // +++++++++++++
    function showNextButton() {
        $("#nextbutton").removeAttr('disabled');
    }
    // +++++++++++++
    function playVideo() {

        gPlayer.api('play');
        return;
    }
    // +++++++++++++
    function pausePlayer() {

        gPlayer.api('pause');
        $("#nextbutton").removeAttr('disabled');
        return true;
    }

    // +++++++++++++
    function nextPlayer() {
        var startPosition = 0;
        var str = "";
        var prevpos = -5;
        var stopPosition = 0;

        var dur = gDuration;
        windowwidth = 3;
        windowwidth = parseFloat(windowwidth);
        if (isNaN(windowwidth)) {
            windowwidth = defaultwidth;
        }
        if (windowwidth < 1) {
            windowwidth = 1;
        }
        if (windowwidth > 3600) {
            windowwidth = 3600;
        }
        windowwidth = Math.round(windowwidth);
        stopindex = stopindex + 1;


        stopPosition = parseFloat(stoparray[stopindex]);

        if (stopPosition > dur) {
            stopPosition = dur;
        }
        /* was here */

        startPosition = parseInt(stopPosition - windowwidth, 10);


        gPlayer.api('seekTo', startPosition);
        gPlayer.api('pause');
        setTimeout(playVideo, 60);

        return false;
    }

</script>

【问题讨论】：

标签： javascript vimeo vimeo-api

【解决方案1】：

Vimeo 确实回答了 - 一种解决方法是，假设您的视频已暂停，首先调用“播放”，然后调用“搜索”，然后播放事件将触发。

【讨论】：