在 Chrome 中完全缓冲视频

是否可以在 Chrome（和 Opera）中完全缓冲 HTML5 视频？

我在亚马逊 S3 上以 .mp4 和 .webm 格式托管电影。在 HTML 中我使用标准<video>标签。服务器响应状态206 Partial Content。它很棒，因为它允许浏览器下载视频的任何部分，但我需要能够立即查找文件的任何部分。

I tried:

1. .PROGRESS事件。当 Chrome 停止缓冲第一部分时，连接将被终止。接下来的部分是在新连接中下载的，因此 JavaScript 无法继续检查下载的总数据。即使可以，旧数据也不会存储在缓存中。此方法适用于 Firefox 和 Safari。哎呀，即使是在 IE10 中！
2. XHRS。我能够完全下载电影，但当视频开始播放时，Chrome 会再次尝试从服务器下载电影。我什至尝试将电影以 base64 格式传递到 HTML 中，但数据太多了
3. FileAPI。 Chrome 无法创建足够大的 BLOB 并崩溃。

欢迎任何帮助！

附注我知道 od 和类似的问题，但我希望自从他们被问到后有所改变。

由于 S3 支持部分下载，Chrome 最初会在播放头前面缓冲“仅需要的内容”，然后停止缓冲。当视频开始播放时，它将继续缓冲“仅需要的内容”。这意味着，根据用户的下载速度，它会时不时地停止缓冲，只是因为它有足够的缓冲区来连续播放。

But如果您在播放一段视频后暂停视频，Chrome 将会not停止缓冲并一直走到最后。

此示例利用该技术在将视频显示在页面上之前将其完全缓冲在屏幕之外。

在 Chrome 32 上测试

// Create video in background and start playing
var video = document.createElement('video');
video.src = 'video.mp4';
video.controls = true;
video.muted = true; 
video.play();

// Pause immediately after it starts playing.
video.addEventListener("timeupdate", function() {
    if (this.currentTime > 0) {

        this.pause();
        video.muted = false;
        video.currentTime = 0
        this.removeEventListener("timeupdate", arguments.callee, false);

        // When whole video is buffered, show video on page
        video.addEventListener("progress", function() {
            if (Math.round(video.buffered.end(0)) / Math.round(video.seekable.end(0)) == 1) {
                document.body.appendChild(video);
                this.removeEventListener("progress", arguments.callee, false);
            }
        }, false);
    }
}, false);