samdutton / simpl

Simplest possible examples of HTML, CSS and Javascript:
https://simpl.info
Apache License 2.0
5.18k stars 1.64k forks source link

Could you show an example of playing truly live video? #104

Closed dschere closed 6 years ago

dschere commented 7 years ago

Your example is just chunks of a static file. We can do this already with <video src="movie.webm"></video>

The true power of the MeidaSource API would be a a way to play live feeds. For example on a server we could call ffmpeg to generated MP4 fragmented chunks:

ffmpeg -re -nostdin -loglevel -8 -i -c:v libx264 -profile:v baseline -level 3.0 -b 192k -reset_timestamps 1 -movflags empty_moov+default_base_moof+frag_keyframe -f mp4 pipe:1

Then route the MP4 fragmented video from "pipe:1" (stdout) on the server to a websocket for transport to the client.

Then in the browser feed the inbound packets to MediaSource.appendBuffer( )

<<<<<<<< BOOM >>>>>>>>>>>>

YOU WOULD THEN HAVE A DROP IN REPLACEMENT FOR THE FLASH MEDIA PLAYER!

samdutton commented 7 years ago

Do you mean the MSE example? That's just meant to outline the basics of the API.

Completely agree though, that this doesn't show the 'true power' of MSE.

Do you have a live demo of what you're suggesting? Sounds good :).

dschere commented 7 years ago

Yes I do. I will put it up on github. I have both the client and server. Probably tonight or tomorrow night. So far it does a great job of live streaming of the big buck bunny which I am re-streaming from ffmpeg on the server to the client via a web socket. I am having difficulties with other video feeds.

Still a work in progress but enough to show what is required to play ffmpeg transcoded video in a browser.

On Thu, Apr 20, 2017 at 12:50 PM, Sam Dutton notifications@github.com wrote:

Do you mean the MSE example? That's just meant to outline the basics of the API.

Completely agree though, that this doesn't show the 'true power' of MSE.

Do you have a live demo of what you're suggesting? Sounds good :).

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/samdutton/simpl/issues/104#issuecomment-295810403, or mute the thread https://github.com/notifications/unsubscribe-auth/ACOb-1n44nerjKr-t0CdPFTTOOeCqM3rks5rx4zLgaJpZM4NC_Hy .

dschere commented 7 years ago

Here is the demo

https://github.com/dschere/mqtt-video

On Thu, Apr 20, 2017 at 12:50 PM, Sam Dutton notifications@github.com wrote:

Do you mean the MSE example? That's just meant to outline the basics of the API.

Completely agree though, that this doesn't show the 'true power' of MSE.

Do you have a live demo of what you're suggesting? Sounds good :).

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/samdutton/simpl/issues/104#issuecomment-295810403, or mute the thread https://github.com/notifications/unsubscribe-auth/ACOb-1n44nerjKr-t0CdPFTTOOeCqM3rks5rx4zLgaJpZM4NC_Hy .