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.

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

import ReactHLS from 'react-hls';

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

• 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