html play a video that is made of lots of queued small videos

时间:2016-02-12 21:35:25

标签: javascript mobile streaming html5-video adaptive-bitrate

How can I manage a video that is made of lots of small videos parts? For instance the original video is split in 1s videos that are each available at different byte rate, so that I can chose each part according to the current bandwidth. Or the original video is a 360 video, and is split in 1s chunks that are available with better quality at different regions, so that I can stream the chunk corresponding to where the user is currently looking at.

It seems that MPEG-DASH players are solving this problem for byte-rate adaption, even though they probably do more.

It sounds not to complicated to do this with a bunch of html5 videos + javascript in desktop, with being careful with what is streamed when and handling transitions. However, on mobile, I need a user interaction to load a video and play it. But I don't want the user to tap his phone every second...

Ideally, the final things would have an api very similar to the html5 video one, with the extra possibility to chose the streaming source at regular intervals. It's very important to me that it works on mobile.

Lot of thanks!

1 个答案:

答案 0 :(得分:1)

是的,MPEG-DASH和HLS正在解决这个问题。

DASH和HLS播放器使用新的HTML5 Media Source Extensions API(MSE)播放多个视频片段,就好像它们只是一个文件一样。

移动是一个问题。 MSE适用于Android版Chrome,但请注意大多数Android手机附带的内置浏览器。众所周知,它们是错误的,缺乏功能。

不幸的是,MSE并没有在iOS上工作。在iOS上唯一可行的是HLS。

大多数人都使用HLS,因为它在iOS设备上得到了广泛的支持和良好的支持。 Android上也支持HLS,虽然它可能会出现问题,特别是在某些设备上(你知道几乎所有的硬件制造商都在生产Android手机,谁知道他们在手机中放置了什么硬件。当谈到机顶盒时,事情就是更糟)。对于桌面浏览器,使用javascript HLS播放器,如hls.js(开源)或Viblast(商业)。

一些流媒体服务器以多种格式打包视频流--HLS,MPEG-DASH,rtmp,因此可以实现回退机制:如果支持HLS,则使用HLS,如果支持则使用MPEG-DASH,或者对于真正旧的浏览器使用rtmp。

DIY解决方案很有趣,但您应该准备好投入大量时间,然后才能在大多数平台(移动和桌面)上运行。