Wednesday, February 8, 2017

Streaming video over HTTP, LIVE!

If you want to stream your desktop to your friend or the world, it quite easy.  Twitch, Youtube and even Facebook now support live video streaming on their site.

But what about streaming live video on your website, without relying on an external source?  This is where the HTTP Live Streaming (HLS) can help you.

All you need is an access to your hosting server.  FTP is quite common and can be used for HLS.  I've done a few experiments with ScreenStudio and I got really good results.


  1. Create a folder on your hosting HTTP server to receive the video stream
  2. In ScreenStudio, enter the full URL address to upload the video stream to the selected folder
  3. FTP Url looks like this: ftp://username:password@ftp.yourserver.com/public_html/live...
  4. Create an HTML file that will be used to view the video stream. 
The HTML viewer file must have this code so the video stream will work on almost all computers and mobiles devices:

<script src="https://cdn.jsdelivr.net/hls.js/latest/hls.js"></script>
<video id="video" width=100% height=430 src="stream.m3u8" autoplay>
</video>
<script>
  if(Hls.isSupported()) {
    var video = document.getElementById('video');
    var hls = new Hls();
    hls.loadSource('stream.m3u8');
    hls.attachMedia(video);
    hls.on(Hls.Events.MANIFEST_PARSED,function() {
      video.play();
  });
 }
</script>
The scripting part is used for PC browsers not supporting HLS natively like mobile devices do.

When your stream starts, there will be a slight delay for about 10 seconds. ScreenStudio will update the video files on your FTP site and viewers will be able to watch your live stream.

To download ScreenStudio: http://screenstudio.crombz.com

Here's a video I made when testing HLS with ScreenStudio:


As you can see in the video, I was even able to AirPlay the video stream from my iPad to my AppleTV, letting my Ubuntu PC display it's desktop directly on the AppleTV.  Cool ;) !