如何让 Chrome 仅加载 HTML5 视频标签的一部分视频？答案

【问题标题】：How can I get Chrome to load only a part of a video for a HTML5 video tag?如何让 Chrome 仅加载 HTML5 视频标签的一部分视频？
【发布时间】：2014-02-12 17:49:37
【问题描述】：

我必须在页面上播放部分视频。

我使用src 中的#t=00:10:00,00:10:30 来读取从 10 分钟开始的 30 秒视频（例如，这些值是根据用户请求在 js 中计算的）。

<video id="html5-video-player" 
    src="http://url.of.the/videos/foo.mp4#t=00:10:00,00:10:30"
    type="video/mp4" style="height: 179px; width: 351px;"></video>

视频加载正常，播放正常。但是一旦剪辑停止，Chrome 就会请求视频的其余部分 (~3GB)，这对我来说是个问题。

知道如何防止额外的加载吗？

我在使用 Apache 或 Node.js (meloncholy/vid-streamer) 作为服务器时遇到问题，所以我猜服务器不是这里的问题。我收到了 206 Partial 请求，并且服务器正确响应了它们。

所以我只能猜测是 Chrome 要求更多视频。

【问题讨论】：

标签： javascript html google-chrome video

【解决方案1】：

我找到了解决问题的方法：

我在pause 事件上添加了一个事件侦听器，并删除了src，它会停止加载。

video.addEventListener('pause', stopLoading, false);

var pauseTime = 0;

function stopLoading() {
    pauseTime = Math.round(video.currentTime);
    video.src = '';
}

我在此处跟踪视频的 currentTime，因此如果用户再次点击播放，视频将从该点开始播放。

为此，我只需将录制的时间转换为 HH:MM:SS 格式并将 src 设置回具有正确时间的视频。

欢迎任何其他想法。

【讨论】：