html - Youtube 的 HTML5 视频播放器如何控制缓冲?

标签 html video youtube

我正在观看一个 youtube 视频,我决定调查其视频播放器的某些部分。我注意到,与我见过的大多数 HTML5 视频不同,Youtube 的视频播放器不执行普通视频源,而是使用 blob url 作为源。

以前我测试过 HTML5 视频,我发现服务器从一开始就开始流式传输整个视频,并在后台缓冲整个视频的其余部分。这意味着如果您的视频是 300 兆,则所有 300 兆都将被下载。如果你搜索到中间,它会从搜索位置一直下载到最后。

Youtube 不能以这种方式工作(至少在 chrome 中)。相反,它设法控制缓冲,因此它在暂停时仅缓冲一定数量。它似乎也只缓冲相关的片段,所以如果你跳过它,确保不会缓冲不太可能被观看的片段。

在我试图调查它是如何工作的过程中,我注意到视频 src 标签的值为 blob:http%3A//www.youtube.com/ee625eee-2802-49b2-a13f-eb374d551d54 ,这使我指向 blobs ,这让我找到了 typed arrays .使用这两个资源,我可以将 mp4 视频加载到 blob 中并将其显示在 HTML5 视频标签中。

然而,我现在坚持的是 Youtube 如何处理这些碎片。查看网络流量,它似乎将请求发送到 http://r6---sn-p5q7ynee.c.youtube.com/videoplayback它以 1.1mb 的 block 返回二进制视频数据。似乎还值得注意的是,由于 HTML5 视频请求引起的大多数正常请求似乎在流式传输时收到 206 响应代码,但 youtube 的 playvideo 调用会收到 200 响应代码。

我试图仅尝试加载一系列字节(通过设置 Range http header ),但不幸的是失败了(我假设是因为视频附带的视频没有元数据)。

在这一点上,我一直在琢磨 Youtube 如何做到这一点。我想出了几个想法,但没有一个我完全接受:

1) Youtube 正在发送自包含的视频和音频 block ,每个 /videoplayback称呼。这在上传方面似乎是一个相当沉重的负担,而且似乎很难将它们拼接在一起以使其看起来像是一个无缝的视频。此外,从调用 $('video').duration 来看,视频标签似乎认为这是一个完整的视频。和 $('video').currentTime ,这让我相信视频标签认为它是单个视频文件。最后,vidoe src 标签永远不会改变,这让我相信它使用的是单个 blob 而不是切换出 blob。

2) Youtube 构建一个空的 blob,其大小预先设定为完整的视频数组,并在下载时用片段更新 blob。然后它会确保用户没有离上次下载的片段太近(以防止用户进入 blob 的未下载部分)。我看到的问题是我看不到任何通过 javascript 动态更新 blob 的方法(尽管我可能只是在搜索时遇到了麻烦)

3) Youtube 下载元数据,然后通过在下载视频片段时按顺序开始构建 blob。我用这种方法看到的问题是我不明白它如何处理后缓冲区域中的搜索。

也许我只是错过了一个摆在我面前的明显答案。有人有任何想法吗?

编辑:我刚刚想到了第四种选择。另一个想法是他们可能使用文件 API 将二进制 block 写入文件并使用该文件进行流式处理。文件 API 似乎具有寻找特定位置的能力,因此允许您用空字节填充视频并在接收到它们时填充它们。这肯定也适合视频搜索。

最佳答案

当您查看 GoogleChrome 的 AppData 时,在播放 YouTube 视频时,您会看到它缓冲在分段文件中。上传到 youtube 的视频是分段的,这就是为什么如果该时间范围在当前片段之外,您无法在第一次点击栏时完美地确定时间范围。

片段的数量取决于视频的长度以及您开始和停止播放视频的时间。

当您链接到视频的时间范围时,它只会跳过该时间范围之前的片段的缓冲。

不幸的是,我对视频播放的编码知之甚少,但我希望这为您指明了正确的方向。

关于html - Youtube 的 HTML5 视频播放器如何控制缓冲?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19238471/

相关文章:

html - 如果屏幕太小,我怎样才能破坏 H1 标题

c# - 视频顶部具有透明背景的控件

php - 在网页中嵌入 AVI/MPG

html - 2013年HTML5视频现状

python - YouTube评论提取API V3

javascript - 获取API : Only redirect if there is no error in POST form

javascript - 如何隐藏不在 HTML 标签内的文本?

iframe - 如何让嵌入的 Youtube 视频自动开始播放?

c# - 如果搜索框位于 _SiteLayout 页面(在标题 DIV 中),如何将搜索结果返回给用户

javascript - 使用播放列表参数嵌入youtube视频