Задача: отправить видеопоток с вэбки клиента на сервер. Код клиента:
var socket = io(":9966");
socket.on('message', function (data) {
console.log(data)
});
var video = document.querySelector('video');
navigator.getUserMedia({video: true}, function(stream) {
console.log(stream);
video.src = window.URL.createObjectURL(stream);
var arrayOfStreams = [stream];
var medias = new MediaStreamRecorder(stream);
medias.ondataavailable = function(blob) {
socket.emit("streaming", blob);
};
medias.start();
socket.emit("streaming", stream);
socket.emit('test', 'mess from 1');
});
Сервер
io.on('connection', function (socket) {
log.info('new con!', socket.id);
socket.send("you connected to server");
socket.on('test', function (data) {
console.log(data);
socket.broadcast.send(data);
});
socket.on('streaming', function (stream) {
log.info("i`m in stream", socket.id);
log.info(stream);
//socket.broadcast.send(stream);
socket.broadcast.emit('streaming', stream);
});
});
При отправке простых текстовых сообщений всё работает как надо,а вот при отправке видео получаю пустое значение.
К Гуглу обращался, но не получилось реализовать(. Буду рад любой помощи. И ещё вопрос на засыпку: как потом полученный от сервера поток преобразовать обратно в видео?
Насколько я понял из вашего кода, вы из одного браузера получаете поток и хотите через сокеты передать всем юзерам в канале. Я бы посоветовал для этого использовать webrtc. Просто подключитесь ко всем по webrtc и передавайте напрямую.
Если же вам вот обязательно нужен сервер, о нужно поступить хитрее. MediaStreamRecorder при наличие данных возвращает Blob. Данные из него прочитать можно только через FileReader API. Попробуйте прочитать этот блок как base64 строку и вот её и отправить. На сервере вы можете раскодировать и сохранить куда-нибудь или отправить другим участникам.
Для того, чтоб обратно закодировать стрим, попробуйте превратить эту base64 строку обратно в блоб и через window.URL.createObjectURL(blob)
установите как адрес видео. Идея в этом.
Айфон мало держит заряд, разбираемся с проблемой вместе с AppLab
Перевод документов на английский язык: Важность и ключевые аспекты
На обычной версии сайта реализован календарь и по клику на дату выводится список данных, связанных с этой датойВозможно ли такое реализовать...
В бекенде api c сущностями - продукты , бренды и категории две последние неограниченной вложенности по методу nestedset
Народ! нужна помощь, нужно сделать две фичи! Like и Комент через ajax на AspNet Core