I'm implementing a video player using the HTML5 video tag. The video asset I'm receiving is hosted and delivered by Brightcove and it's a m3u file. Is it possible to play this video via the HTML5 video tag?
I think the resulting m3u files from the Brighcove server are set up to support adaptive bit rate streaming. I have tried using the m3u file of both the master (which contains details of each rendition) and each individual rendition file.
But nothing happens on my video tag. There aren't any errors in the console, although I kind of thought there would be. I'm using Chrome, and I've read elsewhere that it supports m3u playback?
In your answer please note that I'm completely new to HTML5 playback - and especially m3u files.
Here is my example code:
<video controls autoplay="true">
<source src="http://brightcove.com/example/master.m3u?videoid=1234">
</video>
The contents of the resulting m3u files look like this (sensitive data removed):
#EXTM3U
#EXT-X-STREAM-INF:PROGRAM-ID=1,BANDWIDTH=716000,RESOLUTION=336x184
https://brightcove.com/services/rendition.m3u8?assetId=123456
#EXT-X-STREAM-INF:PROGRAM-ID=1,BANDWIDTH=1325000,RESOLUTION=504x276
https://brightcove.com/services/rendition.m3u8?assetId=123456
#EXT-X-STREAM-INF:PROGRAM-ID=1,BANDWIDTH=1797000,RESOLUTION=720x394
https://brightcove.com/services/rendition.m3u8?assetId=123456
Then the contents of each rendition look something like this:
#EXTM3U
#EXT-X-TARGETDURATION:10
#EXT-X-MEDIA-SEQUENCE:0
#EXT-X-KEY:METHOD=AES-128,URI="https://brightcove.com/services/keyfile?assetId=123456
#EXTINF:11,
#EXT-X-KEY:METHOD=AES-128,URI="https://brightcove.com/services/keyfile?assetId=123456
#EXTINF:11,
#EXT-X-KEY:METHOD=AES-128,URI="https://brightcove.com/services/keyfile?assetId=123456
#EXTINF:11,
etc...
m3u files basically are text files: playlists in a special format that contain references to media files. So, first of all, it would depend on the type of included media files; but second, the video element is not intended for playlists, but only for playing single media files. Currently, there are 3 supported formats for the video
element: mp4, WebM, and ogg. However, m3u files are rather intended for audio playlists. The HTML5 <audio>
element currently supports mp3, ogg and wav files. Still, it depends on the particular browser which one is used (usually, the least you do is supply mp3 and ogg files for the browser to choose from).
To come back to the question: m3u is not supported by the video
or audio
elements.