import {useMediaRecorder} from '@akpoflash/media-recorder'
function App(){
const mediaRecorder = useMediaRecorder();
const video = useRef();
useEffect(() => {
mediaRecorder.init().then(stream => {
video.current.srcObject = stream
});
},[]);
return (
<>
{/* real time streaming */}
<video ref={video} autoPlay={true}/>
{/* recordered video */}
{mediaRecorder.blob && <video width={100} src={URL.createObjectURL(mediaRecorder.blob)} autoPlay={true}/>}
<div>
<button onClick={mediaRecorder.start} children={'start'} disabled={mediaRecorder.recorded || !mediaRecorder.available}/>
<button onClick={mediaRecorder.stop} children={'stop'} disabled={!mediaRecorder.recorded || !mediaRecorder.available}/>
<br/>
<button onClick={mediaRecorder.pause} children={'pause'} disabled={!mediaRecorder.recorded || mediaRecorder.paused || !mediaRecorder.available}/>
<button onClick={mediaRecorder.resume} children={'resume'} disabled={!mediaRecorder.recorded || !mediaRecorder.paused || !mediaRecorder.available}/>
</div>
</>
);
}
-
Notifications
You must be signed in to change notification settings - Fork 0
🎥 Wrapper for recording video through MediaRecorderAPI
License
AkpoFlash/media-recorder
Folders and files
Name | Name | Last commit message | Last commit date | |
---|---|---|---|---|
 |  | |||
 |  | |||
 |  | |||
 |  | |||
 |  | |||
 |  | |||
 |  | |||
 |  | |||
 |  | |||
Repository files navigation
About
🎥 Wrapper for recording video through MediaRecorderAPI
Topics
Resources
License
Stars
Watchers
Forks
Releases
No releases published
Packages 0
No packages published