Как я могу использовать меньше данных в потоковом приложении, которое я создал? - PullRequest
Новая
       20

Как я могу использовать меньше данных в потоковом приложении, которое я создал?

0 голосов
/ 16 апреля 2020

В качестве веселого проекта я решил создать приложение для видеочата, и в настоящее время я работаю над его развитием. Я могу отправить кадры на сервер, и клиенты могут видеть эти кадры, но изображения довольно большие. Я мало что знаю о сжатии или чем-то подобном, как бы уменьшить размер отправляемых данных?

Вот как я сейчас отправляю данные: 

// connect to my server
var stream = new WebSocket("ws://localhost:8081");

const video = document.querySelector('#video');

// request access to webcam
navigator.mediaDevices.getUserMedia({video: {width: 360, height: 360}}).then((stream) => video.srcObject = stream);

const getFrame = () => {
    const canvas = document.createElement('canvas');
    canvas.width = video.videoWidth;
    canvas.height = video.videoHeight;
    canvas.getContext('2d').drawImage(video, 0, 0);
    const data = canvas.toDataURL('image/mpeg');

    return data;
}

// send data
stream.onopen = () => {
    setInterval(() => {
        stream.send(getFrame());
    }, 33) // ~30 fps
}
...