Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Video not play #7

Open
crisari666 opened this issue Jul 16, 2019 · 2 comments
Open

Video not play #7

crisari666 opened this issue Jul 16, 2019 · 2 comments
Labels
bug Something isn't working help wanted Extra attention is needed

Comments

@crisari666
Copy link

I am sending and receiving data but video is not playing: look my code

HTML SEND VIDEO:

HOLA

<script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/2.2.0/socket.io.js"></script> <script type="text/javascript" src='assets/js/SFMediaStreamer.js?'></script> <script type="text/javascript" src="assets/js/admin/streamingVideo.js?"></script>

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

image

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

<script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/2.2.0/socket.io.js"></script> <script type="text/javascript" src="assets/js/SFMediaStreamer.js?"></script> <script type="text/javascript" src="assets/js/admin/recibeVideo.js?"></script>

**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:
image

@StefansArya
Copy link
Member

I think I need to add some tricky code in the library because I also have some problem for the implementation 😅 .

1563687283403

When I restarted the Presenter, the streamer work correctly..
But if I also restart the streamer it paused again..

@crisari666
Copy link
Author

can you share your code bro?

@StefansArya StefansArya added help wanted Extra attention is needed bug Something isn't working and removed help wanted Extra attention is needed labels Oct 2, 2019
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working help wanted Extra attention is needed
Projects
None yet
Development

No branches or pull requests

2 participants