HJPlayer: A JavaScript Player for FLV and HLS Streams in the Browser

Repository: https://github.com/huajiaofrontend/HJPlayer

HJPlayer currently supports playing H264 video and AAC audio encoded FLV streams and HLS streams (decryption not supported) in a browser environment. The project requires the video tag and the Media Source Extensions API to function correctly.

Why was this created?

The project was initiated to solve the problem of simultaneously supporting FLV live streams and HLS playback streams on variety show pages and PC official websites. By merging the functionalities of flv.js and hls.js into a single JavaScript file, the library reduces overall size while providing similar features, though further optimization is still needed.

How the player works

HJPlayer decodes FLV and HLS TS streams, transmuxes them into fragmented MP4 fragments, and then uses the Media Source Extensions API to append these mp4 fragments to an HTML5 video element.

Features

Play FLV live and on‑demand streams encoded with H264 video and AAC audio.

Play HLS live and on‑demand streams encoded with H264 video and AAC audio.

Installation

npm install hjplayer --save

Build

npm install

npm run build

Import Methods

The library can be imported as an ES6 module or via a traditional script src tag.

import HJPlayer from 'hjplayer';

or

<script src="./dist/hjplayer.min.js"></script>

Usage

FLV live stream example:

if (HJPlayer.isSupported()) {
    const player = new HJPlayer({
        type: 'flv',
        url: 'http://xxx.xxx.com/xxxx.flv',
    }, {
        // ...user options
    });
}

HLS live stream example:

if (HJPlayer.isSupported()) {
    const player = new HJPlayer({
        type: 'm3u8',
        url: 'http://xxx.xxx.com/xxxx.m3u8',
    }, {
        // ...user options
    });
}

Demo

Demo URL: http://activity.test.huajiao.com/web/share/banner/2019/testHJPlayer/index.html