Video not play
Opened this issue · 2 comments
I am sending and receiving data but video is not playing: look my code
HTML SEND VIDEO:
HOLA
JS SEND VIDEO
`
(function(){
var socket;
$(()=>{
await socketC();
mediaRecord();
btnAction();
});
function mediaRecord(){
var presenterMedia = new ScarletsMediaPresenter({
audio:true, video: true
}, 1000); // 1sec
presenterMedia.debug = true;
presenterMedia.onRecordingReady = function(packet){
console.log("Recording started!");
console.log("Header size: " + packet.data.size + "bytes");
console.log(packet.data);
// Every new streamer must receive this header packet
// console.log(socket);
let blob = new Blob([packet.data]
, {type:'video/webm'}
);
socket.emit('bufferHeader', blob);
// socket.emit('data', new Uint8Array(packet));
// socket.emit('prueba', {data: 888});
}
presenterMedia.onBufferProcess = function(packet){
console.log("Buffer sent: " + packet[0].size + "bytes");
// console.log(packet);
socket.emit('stream', {data:packet});
}
presenterMedia.startRecording();
setTimeout(()=>{
presenterMedia.stopRecording();
}, 60000);
}
async function socketC(){
socket = await io.connect(
"https://xxxx.xxxxx.xxxx:xxxx",
{transports: [ 'websocket' ], upgrade:false}
);
socket.on('connect',()=>{
console.log('socket conectado');
mediaRecord();
});
}
function btnAction(){
$('#btn').click(()=>{
socket.emit('test', {data: 666});
})
}
})();`
console
JS BACKEND: Socket connection
`
'use strict'
let socket = require('socket.io');
let app = require('express')();
let logger = require('winston');
let http = require('http');
let https = require('https');
let fs = require('fs');
logger.remove(logger.transports.Console);
logger.add(logger.transports.Console, {colorize:true, timestamp:true});
logger.info('SocketIO > listening on port ');
let https_server = https.createServer({
key: fs.readFileSync('../../ssl/mycpanel.pem'),
cert: fs.readFileSync('../../ssl/mycpanel.pem')
}, app).listen(3010);
var io = socket.listen(https_server);
io.sockets.on('connection',function(socket){
console.log('NUEVA CONEXION');
socket.on('prueba',function(data){
console.log('data prueba socjet', data);
})
socket.on('bufferHeader', function(data){
console.log("bufferHeader", data);
io.sockets.emit('bufferHead', data);
});
socket.on('stream', function(data){
console.log("streamer", data);
io.sockets.emit('stream', data);
});
socket.on('videoCam',(data)=>{
io.sockets.emit('videoCam', data);
console.log(data);
});
// socket.on('newOrderToBill', (data)=>{
// console.log(data);
// io.sockets.emit('newOrderToBill',data);
// });
});
`
** HTML RECEIVE VIDEO **
HOLA
PLAY
**JS RECEIVE VIDEO **
` var video = document.querySelector('#video1');
var video2 = document.querySelector('#video2');
var scarlet = false;
var socket;
var chunks = [];
var ms = new MediaSource();
var uno = false;
$(()=>{
socketC();
setTimeout(()=>{
socket.disconnect();
}, 50000);
// receiveVideo();
});
function socketC(){
socket = io.connect(
"https://host3.virtualsoccergroups.com:3010",
{transports: [ 'websocket' ], upgrade:false}
);
socket.on('connect',function(){
if(!scarlet){
playVideo();
//for prevent propagation if socket reconnect
scarlet = true;
}
console.log('socket on')
});
}
function playVideo(){
var videoStreamer = new ScarletsVideoStreamer(video, 1000); // 1sec
videoStreamer.playStream();
// First thing that must be received
socket.on('bufferHead', function(packet){
console.log('bufferHeader',packet);
videoStreamer.setBufferHeader(packet);
});
socket.on('stream', function(packet){
console.log("Buffer received: " , packet);
videoStreamer.receiveBuffer(packet);
});
// Add an effect
var ppDelay = ScarletsMediaEffect.pingPongDelay();
// Stream (source) -> Ping pong delay -> destination
videoStreamer.audioConnect(ppDelay.input);
ppDelay.output.connect(ScarletsMedia.audioContext.destination);
}
function download(blob) {
var link = document.createElement('a');
link.setAttribute('download', 'video.webm');
link.setAttribute('href', URL.createObjectURL(blob));
link.style.display = "none";
// NOTE: We need to add temporarily the link to the DOM so
// we can trigger a 'click' on it.
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
}
function btnAction(){
$('#btnPlay').click(function(){
// playVideo();
video.play();
})
}
`
console:
I think I need to add some tricky code in the library because I also have some problem for the implementation 😅 .
When I restarted the Presenter, the streamer work correctly..
But if I also restart the streamer it paused again..
can you share your code bro?