Save the webcam video on the live server

Question

Save the webcam video on the live server

Navigation

#1 by (2 votes)

2

I want to upload the video that records the webcam to the server. Now what I do is record the video and once the recording is finished upload it whole, to record it use RecordRTC, in addition to HTML5 and Javascript. What I want is to upload it while it is being recorded.

Does anyone know how I can upload the video and save it on the server while it is being recorded?

I do not want to use Flash.

javascript html5 html php nodejs

asked by Miguel Bastida 27.07.2016 в 12:33

source

1 answer

Occupy Ajax requests in more than one cloned select laravel 5 reference System.Net (Windows CE)

score 2 · Answer 1

Suppose the following javascript code to record the video:

var fileType = 'video'; // or "audio"
var fileName = 'ABCDEF.webm';  // or "wav"

var formData = new FormData();
formData.append(fileType + '-filename', fileName);
formData.append(fileType + '-blob', blob);

xhr('save.php', formData, function (fName) {
     window.open(location.href + fName);
});

function xhr(url, data, callback) {
    var request = new XMLHttpRequest();
    request.onreadystatechange = function () {

        if (request.readyState == 4 && request.status == 200) {
            callback(location.href + request.responseText);
        }
    };
    request.open('POST', url);
    request.send(data);
}

The destination script save.php could be the following:

<?php
    foreach(array('video', 'audio') as $type) {
        if (isset($_FILES["${type}-blob"])) {

            $fileName = $_POST["${type}-filename"];
            $uploadDirectory = DIR.'/uploads/'.$fileName;

            if (!move_uploaded_file($_FILES["${type}-blob"]["tmp_name"], $uploadDirectory)) {
                echo(" problem moving uploaded file");
            }

            echo($uploadDirectory);
        }
    }
?>

You can learn more about it here