I followed this example from Html5Rocks, that is using the MediaSource API and a .webm video. I tried the example with another .webm video and it was working, but when I tried with .mp4 video it didn't work. Is it possible somehow?

I followed this example from Html5Rocks., that is using the MediaSource API and a .webm video. I tried the example with another .webm video and it was working, but when I tried with .mp4 video it didn't work. Is it possible somehow?

• javascript
• html
• api
• video
• streaming

• which browsers did you try it in? the example is specifically for Chrome. Did their example work in your browser? Did you do this Support: Currently, the MediaSource API is only available in Chrome Dev Channel 17+ with the --enable-media-source flag set or enabled via about:flags. – Jörn Berkefeld Commented Feb 17, 2012 at 8:19
• Yes, I tried it in chrome. Their example worked, but only with .webm. When I changed the video with .mp4 it didn't work. And what I'm asking is can it somehow work with .mp4 video. I know it works only in Chrome but its fine. – nvlbg Commented Feb 17, 2012 at 13:04
• well, in the demo-description it says "This demo splits a .webm video into chunks using the File APIs" - it's cutting edge stuff, dont expect too much – Jörn Berkefeld Commented Feb 18, 2012 at 12:15
• you are getting not supported error right? media source api in chrome now only supports .webm type. – kongaraju Commented May 24, 2013 at 12:27

4 Answers 4

Update: MP4 (or more formally ISO BMFF) support is in Chrome Dev/Canary. You'll need to generate your MP4 files in a way that conforms to the Media Source spec. Fortunately, Media Source was written with MPEG-DASH in mind, so any DASH-pliant files will work with Media Source. GPAC/MP4Box is a great tool for this:

MP4Box -dash 5000 -frag 5000 -rap some_file.mp4

...will create 'some_file_dash.mp4', which should be patible with Media Source. There are some bugs in earlier released versions of MP4Box, so I remend building from SVN for now.

As @Steven mentioned, use MP4Box to create the dashed MP4 file and try with Chrome canary m23 build (media source api enabled). You need to take care of the following:

1. There should be a single fragment per segment (-dash <ms> -frag <same ms>)
2. The segment should start with SAP (-rap)
3. Modify the demo's script such that it appends segment after segment. Splitting into equal size chunks as in the case of webm does not work for ISO BMFF. You can use mpd file generated by MP4Box to know individual segment sizes.

Update: MP4-DASH is now supported.

MP4 is not supported in Chrome's implementation of the Media Source API yet.

We have plans to add support, but it won't be done for a couple of months. We are currently focusing on updating the existing implementation to match the new version of the Media Source API spec that was recently proposed to the W3C.

You can follow the progess of the implementation upgrade by watching this chromium bug

For playback in HTML5 using the MSE you will need a JS-based player implementations like the open source dash.js player or the bitdash MPEG-DASH player