Skip to content

simple react component for playing hls/rtmp live stream

Notifications You must be signed in to change notification settings

tmark-work/react-hls

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

29 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

react-hls

react-hls is a simple hls/rtmp live stream player. It will use hls.js to play your hls live stream if your browser support html 5 video and MediaSource Extension. Otherwise it will downgrade to Flash play your rtmp live stream.

Todo

  • Start the project
  • Write base component structor
  • Support Hls live stream playing ability
  • Support Rtmp/Flv live stream
  • downgrad solution
  • bugs & Optimization :)

Tutorial

import ReactHLS from 'react-hls';

// In your render function
<ReactHLS url={"your hls http url"} />

Properties

  • url String required

    the hls url that you want to play

  • autoplay Boolean

    autoplay when component is ready default to false

  • constrols Boolean

    whether or not showing the playback controls default to false

  • width Number

    video width

  • height Number

    video height

  • hlsConfig Object

    hls.js config , you can see all config here

  • videoProps Object

    All video tag attributes supported. You can check all attributes here

About

simple react component for playing hls/rtmp live stream

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • JavaScript 93.4%
  • CSS 3.7%
  • HTML 2.9%