videojs-contrib-hls.js's Introduction

HLS plugin for video.js using hls.js

Plays HLS with video.js on any platform, even where it's not natively supported, using Dailymotion's hls.js tech.

This bundled plugin is an alternative to the original videojs-contrib-hls and runs directly on top of video.js 5.0+.

Like the original implemenation, this plugin implements a source handler for m3u8 files.

Installation

NPM

To install videojs-contrib-hls.js with npm run

npm install --save videojs-contrib-hls.js

CDN

Get the latest stable version from the CDN

Releases

Download a release of videojs-contrib-hls

Getting Started

Get a copy of videojs-contrib-hls and include it in your page along with video.js:

<video id=player width=600 height=300 class="video-js vjs-default-skin" controls>
  <source src="https://example.com/index.m3u8" type="application/x-mpegURL">
</video>
<script src="video.js"></script>
<script src="videojs-contrib-hlsjs.js"></script>
<script>
  var player = videojs('#player');
</script>

Options

hls.js is very configurable, you may pass in an options object to the source handler at player initialization. You can pass in options just like you would for other parts of video.js:

<video id=player width=600 height=300 class="video-js vjs-default-skin" controls>
  <source src="https://example.com/index.m3u8" type="application/x-mpegURL">
</video>
<script src="video.js"></script>
<script src="videojs-contrib-hlsjs.js"></script>
<script>
    var player = videojs('video', {
        autoplay: true,
        html5: {
            hlsjsConfig: {
                debug: true
            }
        }
    });
</script>

Recommend Projects