HLS Split and Serve Playlist - http-live-streaming

I want to split and serve a m3u8 playlist to a hls.js client running in a browser. The playlist is big and split and serve is the only option.
When I split and serve till BigBuckBunny_4000_00004.ts as given by the playlist below, movie played till that file. hjs.js fails to play the next sequence of files, even though the rest of the playlist content was served on a subsequent request.
I have tried to add m3u8 header, line 1-6 on every request, the effect was same. Whereas the movie play time was updated in this case.
I couldn't understand the behavior of hls.js client. Please clarify!
#EXTM3U
#EXT-X-VERSION:3
#EXT-X-MEDIA-SEQUENCE:0
#EXT-X-ALLOW-CACHE:YES
#EXT-X-KEY:METHOD=AES-128,URI=BigBuckBunny.key, IV=0x22725d47cccd5db2834c1f1ec375df73
#EXT-X-TARGETDURATION:7
#EXTINF:6.083333,
BigBuckBunny_4000_00000.ts
#EXTINF:6.000000,
BigBuckBunny_4000_00001.ts
#EXTINF:6.000000,
BigBuckBunny_4000_00002.ts
#EXTINF:6.000000,
BigBuckBunny_4000_00003.ts
#EXTINF:6.000000,
BigBuckBunny_4000_00004.ts
#EXTINF:6.000000,
BigBuckBunny_4000_00005.ts
#EXTINF:6.000000,
BigBuckBunny_4000_00006.ts
#EXTINF:6.000000,
BigBuckBunny_4000_00007.ts
#EXTINF:6.000000,
BigBuckBunny_4000_00008.ts
#EXTINF:6.000000,
BigBuckBunny_4000_00009.ts
#EXT-X-ENDLIST

Related

Adding params on mp3 audio for shortcode [audio] in Wordpress

Using the shortcode audio in Wordrepss [audio src="some-file.mp3"] (this one returns an audio player),
I'm trying to add some params after the file extension: [audio src="some-file.mp3?param1=some-value&param2=somo-value-two"] etc, but I can see that the shortcode do not retuns the player, this one returns an link to the audio.
Were you able to achieve this somehow?
Thanks.

How do I show how much video chunk data has been download from server

So youtube shows us how much video has been loaded by showing white line in the timeline, how can i do that?
My video element is just simple containing src = mybackend route
and in my backend I'm just sending 206 partial content with the video file in fs.readfilestream
Please help

Videojs, How to update m3u8 playlist dynamically

I want to add new incoming chunks from backend to the player which is already plaing "live" m3u8 playlist
This is an existing playlist (already set and playing)
#EXTM3U
#EXT-X-PLAYLIST-TYPE:VOD
#EXT-X-TARGETDURATION:6
#EXT-X-VERSION:3
#EXT-X-MEDIA-SEQUENCE:0
#EXT-X-PROGRAM-DATE-TIME:2018-10-19T16:39:07Z
#EXTINF:6.000,
56-06000.ts
#EXTINF:6.000,
56-06000.ts
#EXTINF:6.000,
56-06000.ts
#EXTINF:6.000,
56-06000.ts
#EXT-X-ENDLIST
This is an updated playlist, I want to replace old playlist (listed under) with the next one, but I don't want to reload videojs player with comand (player.src(...))
#EXTM3U
#EXT-X-PLAYLIST-TYPE:VOD
#EXT-X-TARGETDURATION:6
#EXT-X-VERSION:3
#EXT-X-MEDIA-SEQUENCE:0
#EXT-X-PROGRAM-DATE-TIME:2018-10-19T16:39:07Z
#EXTINF:6.000,
56-06000.ts
#EXTINF:6.000,
56-06000.ts
#EXTINF:6.000,
56-06000.ts
#EXTINF:6.000,
56-06000.ts
....
....
many another chunks
....
....
#EXT-X-ENDLIST
How can I do this? Or maybe any other good way to update playlist is existing?

Change the playlist type to EVENT, and don’t write an end tag. Then the player will keep requesting an updated playlist. For more information, please read the spec. https://www.rfc-editor.org/rfc/rfc8216

Extracting first frame of ts segment from HLS Stream(m3u8)

I want to extract first video_frame(image) from ts segments. In my manifest file m3u8 iframe tag is not coming. Can anyone suggest how to extract first video_frame(image) without downloading complete ts segment.

JSF play video file

I want to play a video file from my web app. I use JSF. I want to know how we can open the video file with the help of any video player installed in the client's system. I know how to open a pdf file the same way. But I want to know how to open a video file.

There's no standard JSF component for this. It's however not different from as you would do in plain HTML. Just drop the video file in public webcontent (so that it's reachable by an URL) and use the HTML <embed> and/or the <object> element which points to the URL of the video file. That's basically all. Note that you can just use EL in template text. So e.g. <embed src="#{bean.videoURL}"> would work perfectly fine, as long as it generates the HTML code the way you intend (open page in browser, rightclick and View Source to see it).
The way how to create and parameterize the HTML <embed> or <object> tag in turn depends on the video format (MPEG, MOV, FLV, etc). You basically need to consult the documentation of the video format vendor for details how to use it. Since you didn't mention what format the video file is in, we can't help you further in detail. Googling the smart way should however yield sufficient examples. E.g. "embed mpeg in html".
PrimeFaces has however a <p:media> component which makes it all easier for developers who are lazy in Googling for examples and/or figuring the browser specific inconsitenties ;) It'll outright generate the right HTML code necessary for the provided video format.
See also:
How to stream audio/video files such as MP3, MP4, AVI, etc using a Servlet

This works in browsers those support HTML5.
<video controls="controls">
<source src="resources/myVideo.mp4" type="video/mp4"/>
</video>

Resources