Categories
Programming

How to play HLS with JWPlayer

In this post we will show you a simple way how to play HLS into web browser with JW PLayer – the free version.

Even on JW Player website is saying you need the Premium version for HLS, we found it is working also with the free version together with HLSprovider plugin.

We assume the root website is in /var/www/html.

First, you must download jwplayer-6.7 from http://www.jwplayer.com/ and save the archive in /var/www/html, on the web server.
Unpack the archive:

[code language=”bash”]
unzip jwplayer-6.7.zip
cd jwplayer
[/code]

Clone the HLSProvider plugin:

[code language=”bash”]git clone https://github.com/mangui/HLSprovider[/code]

We will create the HTML file where we will display the player:

[code language=”bash”]nano index.html[/code]

and paste the code below (of course you need to adjust it, replacing mydomain.com with your real domain name or IP):

[code language=”bash”]
<html>
<head>
<script type="text/javascript" src="http://mydomain.com/jwplayer/HLSprovider/test/jwplayer6/jwplayer.js"></script>
</head>
<body>
<div id="player">Loading the player…</div>

<script type="text/javascript">
jwplayer("player").setup({
playlist: [{
// file is the url to m3u8 file
file:’http://mydomain.com/hls/bbb.m3u8′,
provider: ‘http://mydomain.com/jwplayer/HLSprovider/test/jwplayer6/HLSProvider6.swf’,
type:’hls’
}],
width: 640,
height: 480,
primary: "flash"
});
</script>

</body>
</html>
[/code]

That’s all. Now point your browser to http://mydomain.com/jwplayer/ and you can play the video.
This example ‘should’ work both on iOS devices and PCs with Flash support.

You can see the example here – if the server is up

You can read also the blog post about HLS Video on Demand streaming

Leave a Reply

Your email address will not be published. Required fields are marked *