Videojs live offline plugin

In the video example above, initial HLS playlist throws 404 (not existing) error. Offline stream starts to play.
After the second offline video loop, live video is back online.

Live video offline plugin details

Most often there are 2 scenarios when live stream is offline. Either live stream playlist file does not exist or it is empty. When the file does not exist, this is simply 404 error and the player triggers same error on every browser, every device. It is different when playlist file exists but it is empty. On iOS device, the player triggers same error as for non-existing file, but in other browsers (with MSE support) the player attempts to try playlist every 5 seconds about infinitely.
In the past, we published several methods to play offline video or show offline image when live stream is not available. Since Nuevo plugin 8.0 all those methods are no longer in use, replaced by more universal offline plugin.
Our plugin is prepared for both mentioned scenarios. When the playlist file does not exist, the player either starts to play short offline video in a loop or shows offline image. When offline stream ends or offline timeout reached, the live stream is tested and started when it's back online. The empty playlist file is tested in a similar way. When it contains information about the stream, the player attempts to play it.
The offline plugin features 3 easy to understand options.
  • offlineStream - URL of the offline video
  • offlineImage - URL of the offline Image
  • offlineTimeout (default 30) - timeout value (seconds) for offlineImage to retry original live stream
  • offlineCountdown (default false) - set "true" to enable visible countdown
You need to load offline plugin and initialize it.
Code snippet
<script src="//domain.com/videojs/videojs.min.js"></script>
<script src="//domain.com/videojs/nuevo.min.js"></script>
<script src="//domain.com/videojs/plugins/videojs.offline.js"></script>

var player = videojs('myplayer'); 
player.nuevo();
player.offline(offlineStream: "//domain.com/path-to-video-file");
</script>
To use offlineImage instead of offlineStream you can do it as follows:
Code snippet
player.offline(offlineImage: "//domain.com/path-to-video-image.jpg", offlineTimeout:60);
offlineTimeout usage is optional. If you skip it, default value of 30 seconds will be used.

In example above HLS m3u8 playlist file does not exists. We use offline 30 seconds mp4 video to play in such scenario. After second run of offline video, initial live stream playlist m3u8 file is back online and starts playing. Demo above use offlineCountown option enabled.