Как записать видео в электронном формате, которое воспроизводится с моего потокового сервера - PullRequest
Новая
       32

Как записать видео в электронном формате, которое воспроизводится с моего потокового сервера

4 голосов
/ 15 апреля 2020

Во-первых, это не дубликат, который я не читаю из потока камеры. поэтому я не нашел ни одного учебника или документации по этой теме.

Я создаю клиентское приложение сервера, мой сервер использует ffmpeg для транскодирования и потоковой передачи содержимого ipcameras, а мой электронный клиент использует и отображает эти камеры В моем приложении

для этого у меня есть следующая реализация

функция добавления игрока 


function addPlayer(p) {
    var node = document.createElement("div");
    node.setAttribute('class', "item4X4");
    node.setAttribute('id', "panel-video-" + p);
    node.innerHTML = "<div ondblclick='fullscreen(" + `"` + p + `"` + ")' class='item-content'><div class='panel-heading'><div class='panel-title-box'><span>Users vs returning</span></div><div class='panel-body padding-0'><video class='autosize' id='player_" + p + "' style='width:100%; height:240px;' autoplay muted></video></div></div>";

    /*document.getElementById("grid").appendChild(node);*/

    grid.add([node]);


    grid.show([node], {
        onFinish: function (items) {
            playVideo(p);
        }
    });



}

и функция воспроизведения 


function playVideo(p1) {

    var video = document.getElementById('player_' + p1);
    var player = new Hls();
    source = screenSource(p1);
    console.log(source);
    player.attachMedia(video);
    player.on(Hls.Events.MEDIA_ATTACHED, function () {
        player.loadSource(source);
        player.on(Hls.Events.MANIFEST_PARSED, function () {
            video.play();
        });
    });
}

Есть ли решение для записи воспроизводимого видео?

1 Ответ

1 голос
/ 25 апреля 2020

Я думаю, что решение в событиях Hls.Events.BUFFER_APPENDING или Hls.Events.BUFFER_APPENDED.

BUFFER_APPENDING запускается, когда сегмент добавляется в буфер - данные: {сегмент: сегмент объекта}

BUFFER_APPENDED вызывается при добавлении сегмента к данным буфера: {parent: родительский сегмент, который вызвал BUFFER_APPENDING, в ожидании: nb сегментов, ожидающих добавления для этого родительского сегмента, timeRanges: {video: TimeRange , аудио: TimeRange}

Я не смог проверить это, но вы можете попробовать: 

var streamRecord = [];

function startRecord(p1) {
    var video = document.getElementById('player_' + p1);
    var player = new Hls();
    source = screenSource(p1);
    console.log(source);
    player.attachMedia(video);

    player.on(Hls.Events.MEDIA_ATTACHED, function () {
        player.loadSource(source);
        /*player.on(Hls.Events.MANIFEST_PARSED, function () {
            video.play();
        });*/
        player.on(Hls.Events.BUFFER_APPENDING, function (event, data) {
            streamRecord[data.type].push(data.data);
        });
    });
}


var downloadURL = function(data, fileName) {
    var a;
    a = document.createElement('a');
    a.href = data;
    a.download = fileName;
    document.body.appendChild(a);
    a.style = 'display: none';
    a.click();
    a.remove();
};

var downloadVideo = function(data, fileName) {
    var blob, url;
    blob = new Blob([data], { type: 'application/octet-stream' });
    url = window.URL.createObjectURL(blob);
    downloadURL(url, fileName);
    setTimeout(function() {
        return window.URL.revokeObjectURL(url);
    }, 1000);
};

downloadVideo(streamRecord, 'video.mp4');
...