在HTML5播放器中搜索媒体时,您可以使用currentTime结构跳转(搜索)到特定时间。
如何在浏览器中实现JavaScript API,currentTime?
例如,
mediaElement.currentTime = 122; // Seek to 122 seconds in the video
我在电线上看到的内容(使用wireshark)是:
GET /videos/q1fx20VZ-52qL9xLP.mp4 HTTP/1.1
...
Range: bytes=47864170-
所以,我的猜测是,客户端的某个实体正在从时域转换为字节域。
请帮助神秘化吗?
答案 0 :(得分:2)
currentTime
属性在获取时必须返回media element default playback start position,除非是零,在这种情况下它 必须返回元素的official playback position。归来了 值必须以秒表示。在设置时,如果是media element 有一个current media controller,然后用户代理必须抛出一个InvalidStateError
例外;否则,如果media element的话readyState
为HAVE_NOTHING
,然后必须设置media element default playback start position新值;否则,它必须 将official playback position设置为新值,然后将seek设置为 新的价值。必须将新值解释为以秒为单位。
您似乎想要seek
案例。
然后,根据http://www.whatwg.org/specs/web-apps/current-work/multipage/the-video-element.html#dom-media-seek,
seekable
属性必须 返回一个新的静态规范化 表示范围的TimeRanges
对象 媒体资源,如果有的话,那个用户 代理人能够在属性的时候寻求 评价。如果用户代理可以寻求媒体资源中的任何地方,例如因为它是一个 简单的电影文件和用户代理以及服务器支持HTTP范围 请求,然后该属性将返回一个范围的对象, 其开头是第一帧的时间(最早的位置, 通常为零),其结尾与第一次的结束时间相同 frame加上duration属性的值 (这将等于最后一帧的时间,可能是正面的 无穷大)。
范围可能会不断变化,例如如果 用户代理正在缓冲无限流上的滑动窗口。 这是DVR观看直播电视时所见到的行为 实例
媒体 资源可能是内部脚本或交互式的。因此,一个 媒体元素可以非线性播放 时尚。如果发生这种情况,用户代理必须表现得好像 每当当前播放位置时使用搜索算法 以不连续的方式变化(以便相关事件触发)。 如果媒体元素具有当前媒体控制器,则 用户代理必须寻求 适当的媒体控制器。
答案 1 :(得分:1)
大多数人认为像.mp4
这样的视频文件是一个文件,但实际上avi, mp4, mkv
和many more只是在其中存储大量信息的容器。最好的比喻是存档(你看的是一个文件,但是很多文件只是组合在一起并压缩)。大多数情况下,这个容器内部有音频和视频(已同步)和一些元数据,这有助于读取此容器的程序了解其中的内容。您可以阅读有关编解码器和容器here
当您观看视频时,您实际上正在访问这两个视频流(视频和音频)。在此期间,您的计算机正在执行多项操作:
为了了解视频导航(以及基本解码)是如何工作的,您需要了解视频的编码方式。你可以阅读它here。基本上一切都围绕三个主要框架发展:
这样做是因为如果您将视频存储为一系列.jpg图片,那将会非常庞大。 P帧和B帧可以节省空间。 (如果你曾试图从torrent中打开未完全下载的视频,并看到当你转发回来并迫使你几乎看不到里面的内容时,你现在知道为什么会这样,P帧和B帧不存储所有信息)。因此,当您向前和向后移动时,您将在I帧之间导航。 Container存储有关这些I帧位置的信息,并允许您快速浏览文件。 HTML5为您提供了API和API来访问这些数据,当您进行API调用mediaElement.currentTime = 122
时,浏览器只是将时间转换为您必须读取新信息的偏移量。如果需要,您可以深入了解一些开源浏览器代码,并检查这是如何实现的。
是在一天结束时写的,所以我想吃饭,没有足够的时间。如果你看到一些不准确之处 - 随意编辑。