地球上最准确的视频暂停（currentTime Vs mediaTime 和 requestVideoFrameCallback Vs setInterval）答案

【问题标题】：Most accurate video pause on Earth (currentTime Vs mediaTime And requestVideoFrameCallback Vs setInterval)地球上最准确的视频暂停（currentTime Vs mediaTime 和 requestVideoFrameCallback Vs setInterval）
【发布时间】：2021-05-15 04:28:08
【问题描述】：

假设我们想尽最大努力根据视频元素的给定点（时间点）创建最准确的视频暂停功能。

所以我们尝试这个来做实验：

var vid = document.getElementById("myVideo");

Method1();
Method2();

function Method1() {
  const doSomethingWithTheFrame = (now, metadata) => {
  // Do something with the frame.
  console.log(vid.currentTime, now, metadata);
  if(metadata.mediaTime >= 0.5) {
    console.log("Method1 Executed Here", vid.currentTime, metadata.mediaTime);
    vid.pause(); // reached 0.5 so stop the video
    return;
  }
  // Re-register the callback to be notified about the next frame.
  vid.requestVideoFrameCallback(doSomethingWithTheFrame);
};
  // Initially register the callback to be notified about the first frame.
  vid.requestVideoFrameCallback(doSomethingWithTheFrame);
}

function Method2() {
  const endCheck = setInterval(endCheckInterval, 5);
  function endCheckInterval() {
    if (vid.currentTime >= 0.5) {
       clearInterval(endCheck);
       console.log("Method2 Executed Here", vid.currentTime);
       //vid.pause(); // reached 0.5 so stop the video
 
    }
  }
}

<!DOCTYPE html> 
<html> 
<body> 
  <video id="myVideo" width="320" height="176" controls>
    <source src="https://www.w3schools.com/tags/mov_bbb.mp4" type="video/mp4">
  </video>
</body> 
</html>

如你所见，我比较了vid.currentTime 和metadata.mediaTime，两者之间有一点区别......

我们应该使用哪一个来确保在视频 0.5 秒处的可靠性和准确暂停？

【问题讨论】：

不知道你的目标，会在这个帮助中回答吗？ stackoverflow.com/questions/5981427/…

标签： javascript html

【解决方案1】：

在 Chromium 的实现中，我们使用音频时钟作为支持 video.currentTime 的时间源，而 mediaTime 直接由帧的 presentationTimestamp 填充。如果您想以可重现的方式准确识别帧，包括准确识别您错过了哪些帧，您应该使用mediaTime。

【讨论】：