hls.js

Multivariant Playlist tags

#EXT-X-STREAM-INF:<attribute-list> <URI>
#EXT-X-MEDIA:<attribute-list>
#EXT-X-SESSION-DATA:<attribute-list>
#EXT-X-SESSION-KEY:<attribute-list> EME Key-System selection and preloading
#EXT-X-START:TIME-OFFSET=<n>
#EXT-X-CONTENT-STEERING:<attribute-list> Content Steering
#EXT-X-DEFINE:<attribute-list> Variable Substitution (NAME,VALUE,QUERYPARAM attributes)

The following properties are added to their respective variants’ attribute list but are not implemented in their selection and playback.

VIDEO-RANGE (See #2489)

Server-side-rendering (SSR) and `require` from a Node.js runtime

You can safely require this library in Node and absolutely nothing will happen. A dummy object is exported so that requiring the library does not throw an error. HLS.js is not instantiable in Node.js. See #1841 for more details.

Getting started with development

First, checkout the repository and install the required dependencies

git clone https://github.com/video-dev/hls.js.git
cd hls.js
# After cloning or pulling from the repository, make sure all dependencies are up-to-date
npm install ci
# Run dev-server for demo page (recompiles on file-watch, but doesn't write to actual dist fs artifacts)
npm run dev
### Linter (ESlint)

Run linter:

npm run lint


Run linter with auto-fix mode:

npm run lint:fix


Run linter with errors only (no warnings)

npm run lint:quiet


### Formatting Code

Run prettier to format code

npm run prettier


### Type Check

Run type-check to verify TypeScript types

npm run type-check


### Automated tests (Mocha/Karma)

Run all tests at once:

npm test


Run unit tests:

npm run test:unit


Run unit tests in watch mode:

npm run test:unit:watch


Run functional (integration) tests:

npm run test:func “`

Design

An overview of this project’s design, it’s modules, events, and error handling can be found here.

Demo

Using HLS.js

CORS

All HLS resources must be delivered with CORS headers permitting GET requests.

Video Control

Video is controlled through HTML <video> element HTMLVideoElement methods, events and optional UI controls (<video controls>).

Build a Custom UI

Media Chrome

Player Integration

The following players integrate HLS.js for HLS playback:

JW Player
Akamai Adaptive Media Player (AMP)
BridTV Player
Clappr
Flowplayer through flowplayer-hlsjs
MediaElement.js
KalturaPlayer through kaltura-player-js
Videojs through Videojs-hlsjs
Videojs through videojs-hls.js. hls.js is integrated as a SourceHandler – new feature in Video.js 5.
Videojs through videojs-contrib-hls.js. Production ready plug-in with full fallback compatibility built-in.
Fluid Player
OpenPlayerJS, as part of the OpenPlayer project
CDNBye, a p2p engine for hls.js powered by WebRTC Datachannel.
M3U IPTV

They use HLS.js in production!










cdn77

Chrome/Firefox integration

made by gramk, plays hls from address bar and m3u8 links

Chrome native-hls
Firefox native-hls