1

好的，所以我有两个 video.js 播放器（canv1 和 canv2），每个播放器都播放相同视频的副本。我想在canv1的某个时间码暂停canv2，然后在canv1的稍后时间码，将canv2与canv1同步并播放。

目标是canv2可以暂停自己然后赶上canv1。问题是，我的同步功能遇到了问题。有某种滞后，所以当我同步时，我会丢失 7 到 10 帧视频。

这就是这个概念。此代码使用 Video.JS API。https://github.com/zencoder/video-js/blob/master/docs/api.md

var conchShell = canv1; // Lord of the Flies, Bitch!

// Accepts player objects as arguments - canv1, canv2
function pause(){ 
    for (var i = 0, j = arguments.length; i < j; i++){
        arguments[i].pause();
        console.log( arguments[i] + '1 is paused' ); /* TODO: REMOVE CONSOLE LOGS BEFORE DEPLOYMENT */
    }
}   

function play(){    
    for (var i = 0, j = arguments.length; i < j; i++){
        arguments[i].play();
        console.log( arguments[i] + '1 is playing' );
    }
}

function syncToConchShell() {
    for (var i = 0, j = arguments.length; i < j; i++){
        arguments[i].currentTime(conchShell.currentTime());
        console.log( arguments[i] + 'was synchronized with' + conchShell );
    }
}

conchShell 是拥有主时间线的玩家，其他玩家与之同步。所以问题是，当我运行同步功能时，conchShell 视频仍然比我尝试同步的视频提前 5 到 10 帧结束。我认为这是由于运行同步功能所需的时间。即，视频在几分之一秒内完全同步，但在 canv2 赶上之前，conchShell 已经领先了几帧。

所以问题是：有没有一种简单的方法可以计算出一个函数运行了多少时间？因为如果有的话，我可以把那个时间附加到canv2上的时间码上，我们就很好了。

更新：

好的，我尝试了其他一些方法。我现在正在使用异步库并且取得了更多的成功。我唯一的问题是它在 async.js 的第 505 行抛出“对象不是函数”错误。据我所知，这通常是因缺少分号而引发的错误。

无论如何，这是我现在所拥有的现场版本。如果您愿意，请查看代码

http://staging.15four.com/videotest

4

1 回答 1

1

如果您使用的是 HTML5 视频或 Flash 后备，则没有任何信息。你在这两个方面都有问题吗？我在使用 Flash 播放器时遇到的一个问题是它不允许完美的搜索——所以几乎总是你只有几帧。

回答您的问题：有一种简单的方法可以测量函数花费了多长时间：

var start = new Date();
// some code to measure
var end = new Date();
var diffMs = end - start;

但是我不认为它可以解决你的问题。

如果您只关心 HTML5 视频，那么我可以向您建议不同的可能性：

  1. Popcorn.js库是为将视频与内容同步而设计的，不过我还没有看到有两个视频的工作示例。
  2. GitHub 上有一个mediagroup.js的原型- 用于同步视频的库。

第二个很有趣——他们正在使用requestAnimationFrame函数，如果你正在使用setTimeout或者你应该切换到它setInterval——它更准确。

更新： 解决您直接使用异步的问题：我在 Chrome 中更新代码时遇到的问题是：对象不是函数。我以前没有使用过 async.js。但似乎你应该将函数或对象数组传递给你的 async.parallel，可能像这样：

async.parallel([
    function() {
        async.each(players, syncSingleToConch, function() {
            console.log('error with the each function');
        })
    },
    function() {
       conchShell.currentTime(arguments[0].currentTime())
    } /* ... more ... */ 
]);

然而，函数async.parallel采用回调参数，我认为这才是真正的异步。与迭代器相同async.each- 它们具有项目和回调作为参数。我无法提供更多帮助，因为我不是该主题的专家。也许用 async.js 标签标记你的问题？

于 2013-04-17T16:50:37.020 回答