Блог

Я пытаюсь передать поток a со стороны клиента на сторону сервера, чтобы позже передать видео обратно другому клиенту.

Дело в том,:

Как я могу получить фрагменты видео из клиентского JavaScript (которые могут быть отправлены на сервер)?

используя этот код, например:

 var x = new XMLHttpRequest();
        var url = location.href;
        x.onreadystatechange = function(){
            if(x.readyState == 200) {
                console.log("done");
            } else {
                console.log("chunk",x.response); //this is null until readyState is 200 anyway
            }

        }
        x.onprogress = e => {
            console.log("EE",e.target.response); //also null if resposneType is arraybuffer
        };
        x.responseType="arraybuffer";
        x.open("GET","http://localhost:88/videoplayback.mp4",true);
        x.send("");
  

Когда я пытаюсь напечатать ответ до его завершения загрузки (чтобы получить его по частям), то он просто равен нулю; arraybuffer возвращается как respnse только после завершения загрузки.

Если я удаляю responsetype и просто оставляю его в виде обычного текста, то действительно некоторые символы unicode выводятся на экран для каждого readystatechange даже до его завершения, только arraybuffer этого не делает.

Итак: это лучший способ потоковой передачи видео с клиента на сервер, и если да, то как я могу это сделать? а если нет, то какой способ лучше?

Действительно, arraybuffer или blob типы ответов не разрешают доступ к фрагменту данных до завершения загрузки.

Итак, есть способы… Например, в новейших браузерах вы могли бы запустить ReadableStream из fetch API, или в Firefox вы могли бы установить responseType значение "moz-chunked-buffer" , но это совсем не то, что вам нужно здесь.

То, что вы описываете, — это именно то, для чего был создан WebRTC. Итак, лучший способ — запустить сервер STUN / TURN и передавать ваши медиа через него, используя MediaStream API.