Play your HLS (Http live streaming) inline with autostart and on desktops.

With the advanced of JavaScript applications (there is noticeable increase in their size) and mobile devices specifications there are attempts to implement whole video decoders entirely in JavaScript. We decided not to fall behind and produced a solution that allows you to play HLS inline and possibly with autostart by doing decoding in JavaScript. Here is a live example of the player that we made:

Current frame:

In ideal world all you need is the url to your HLS playlist (ends with .m3u8), however there are some limitations and extra contritions. Firstly to play your HLS stream inline on a device like iPhone or Android your video needs to be encoded using H264 baseline profile which means JavaScript decoder does not support B frames and CABAC entropy. If you are using Flash Live Media Encoder choose H264 from Format selection and choose baseline profile by clicking on the wrench icon close to it.

Secondly there is lots going on to decoder H264 video and display it using canvas element so that it plays inline, so when it comes to hand-held devices a decent frame rate is currently achieved on the latest iPhones that is 5s(iOS 7) and Androids, on older models frame rate can be much lower. We are also working on a special low computational video codec JavaScript Video (.jsv) that allows to play videos in JavaScript and has requirements that are much lower. Plus there is an implementation of a full H264 decoder in JavaScript.

Thirdly the transport stream chunks are loaded using Ajax requests and thus if your web site and HLS url have different domains and you don't have access to the streaming server it's a bit difficult to set this up due to JavaScript cross-origin policy restrictions. You can however use something like Apache proxy module to overcome this issue.

On the other hand this adds an option to play HLS on most of desktops in most of browsers. There are Flash player plagins that allow you to do the same though.


Please wait...