Search code examples
javascriptvideomp4media-source

Streaming mp4 live broadcasting video content over websocket to mediasource element


I have a number of questions related to streaming (via websockets) on-air broadcasting h264 video to MediaSource element inside of mp4 container:

  • Do i need ftyp? If i do, do i need it to be in the same Uint8Array as moov?
  • Do i need to send every mp4 box separatly or can i hope that sourceBuffer.appendBuffer(data) will sort them out?
  • Do i need to send moof and mdat together or should the be fed in different calls to sourceBuffer.appendBuffer(data)?
  • Do i need any other kind of boxes, specifically for indicating timestamps?
  • Do i need to indicate to MediaSource element when to start playing appended data chunks?
  • Do i have to set any duration/timestampOffset-related things?
  • Is there any crucial points in moov box i should be aware of when trying to produce live stream?

Solution

  • The moov box is the initialization segment and it is required so the decoder knows what it needs to decode, any other boxes should be ignored (never tried to include a fragment at initialization, so maybe that's not allowed) so no need to remove them.

    moof and mdat boxes should be appended in a single call (those are the segments), no other boxes are needed. As far as I know timestamp data is included in the moof box, so no need to add anything else.

    Basically you are good with a sequence of moov [moof mdat]+.