RecordRTC and Upload to PHP Server | Getting Started

RecordRTC and Upload to PHP Server | Getting Started via: http://www.muazkhan.com/ https://github.com/muaz-khan/RecordRTC

HTML

<script src="https://cdn.WebRTC-Experiment.com/RecordRTC.js"></script>
<video id="your-video-id" controls="" autoplay=""></video>

CSS

video {
  max-width: 100%;
  border: 5px solid yellow;
  border-radius: 9px;
}
body {
  background: black;
}

JavaScript

// capture camera and/or microphone
navigator.mediaDevices.getUserMedia({
    video: true,
    audio: true
}).then(function(camera) {

    // preview camera during recording
    document.getElementById('your-video-id').muted = true;
    document.getElementById('your-video-id').srcObject = camera;

    // recording configuration/hints/parameters
    var recordingHints = {
        type: 'video'
    };

    // initiating the recorder
    var recorder = RecordRTC(camera, recordingHints);

    // starting recording here
    recorder.startRecording();

    // auto stop recording after 5 seconds
    var milliSeconds = 5 * 1000;
    setTimeout(function() {

        // stop recording
        recorder.stopRecording(function() {

            // get recorded blob
            var blob = recorder.getBlob();

            // open recorded blob in a new window
            window.open(URL.createObjectURL(blob));

            // release camera
            document.getElementById('your-video-id').srcObject = null;
            camera.getTracks().forEach(function(track) {
                track.stop();
            });
            
            // you can preview recorded data on this page as well
            document.getElementById('your-video-id').src = URL.createObjectURL(blob);

        });

    }, milliSeconds);
});