HLS stream on safari using MediaSource api

I want to stream HLS snippets using a media source extension. I tried the same using mpeg-dash snippets (generated using MP4Box) and media source extension.

var mediaSource = new window.MediaSource();
mediaSource.addEventListener('sourceopen', _onSourceOpen);
$('video').attr('src', URL.createObjectURL(self.mediaSource));

function _onSourceOpen() {
    sourceBuffer = mediaSource.addSourceBuffer('video/mp4; codecs="avc1.64000d,mp4a.40.2"');
}

function _onFragmentDataLoad(data) {
    sourceBuffer.appendBuffer(data);
}

      

        
        
        
      

    

It plays smoothly on Chrome, Windows 8 IE, android chrome. This also applies to safari works, but it does not receive the full duration of the media. So I tried the same with HLS snippets on safari. The generated HLS data has a .m3u8

file and other chunks .ts

. When I assign the .m3u8 file as the source for the video element:

$('video').attr('src', 'filename.m3u8');

      

        
        
        
      

    

everything works like a charm. But then I lose control of the transport. In order to have full control over the transport and be responsive to permission changes, I tried to put the fragments .ts

one after the other in the initialized one sourcebuffer

. He does not do well on safari. But the same HLS snippets go well with exo player

. My questions are: 1. How to achieve HLS streaming on safari using Media Source extension. 2. Since HLS generation does not generate a snippet init

unlike dash generation, how does the media player understand duration and other metadata? 3. How do I get the codec for this HLS? Or is there any codec that is supported by safari by default and can be used here?

Thank.