동영상 플레이어 라이브러리

React player

Prop Description
onReady Called when media is loaded and ready to play. If playing is set to true, media will play immediately
onStart Called when media starts playing
onPlay Called when media starts or resumes playing after pausing or buffering
onProgress Callback containing played and loaded progress as a fraction, and playedSeconds and loadedSeconds in seconds <br>  ◦  eg { played: 0.12, playedSeconds: 11.3, loaded: 0.34, loadedSeconds: 16.7 }
onDuration Callback containing duration of the media, in seconds
onPause Called when media is paused
onBuffer Called when media starts buffering
onBufferEnd Called when media has finished buffering <br>  ◦  Works for files, YouTube and Facebook
onSeek Called when media seeks with seconds parameter
onPlaybackRateChange Called when playback rate of the player changed <br>  ◦  Only supported by YouTube, Vimeo (if enabled), Wistia, and file paths
onPlaybackQualityChange Called when playback quality of the player changed <br>  ◦  Only supported by YouTube (if enabled)
onEnded Called when media finishes playing <br>  ◦  Does not fire when loop is set to true
onError Called when an error occurs whilst attempting to play media
onClickPreview Called when user clicks the light mode preview
onEnablePIP Called when picture-in-picture mode is enabled
onDisablePIP Called when picture-in-picture mode is disabled

이런 콜백함수도 지원해주고 다른 메서드들도 많이 지원해줘서 MVP 단계 이후에 동영상 플레이어를 커스텀한다고 했을 때 유용하게 사용할 수 있을듯!

비디오 청크 단위로 가져오기

HLS (HTTP Live Streaming)

hls.js demo