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

call on stream event receives same remote stream twice #609

Open
xoraingroup opened this issue Dec 18, 2019 · 19 comments
Open

call on stream event receives same remote stream twice #609

xoraingroup opened this issue Dec 18, 2019 · 19 comments
Labels
bug client related to peerjs client investigating currently being looked into

Comments

@xoraingroup
Copy link

xoraingroup commented Dec 18, 2019

Using a very simple example from peerjs.com between two peers.

var getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia;
peer.on('call', function(call) {
  getUserMedia({video: true, audio: true}, function(stream) {
    call.answer(stream); // Answer the call with an A/V stream.
    call.on('stream', function(remoteStream) {
      // Show stream in some video/canvas element.
     console.log('Received stream', remoteStream);
    });
  }, function(err) {
    console.log('Failed to get local stream' ,err);
  });
});

call.on('stream') always receives two same remote streams.

Here is a screen shot.

issue

Is it a known issue?

Thanks

@xoraingroup xoraingroup changed the title call on stream event receives two remote streams call on stream event receives same remote stream twice Dec 18, 2019
@xoraingroup
Copy link
Author

any one can coment on this please?

@Ponao
Copy link

Ponao commented Dec 24, 2019

I came across this problem, it looks like this happens when we transfer a stream to another client (audio: true, video: true), try to check this, transfer the stream from both video and audio, and then only with audio, I solved this problem possibly incorrectly , but it works, I check if I already received this stream (when I receive it, I save the stream, for example, in an array and put down a unique key for it, for example, the user id that can be obtained by passing {metadata: {user_id: 123}})

@afrokick afrokick added bug investigating currently being looked into labels Dec 24, 2019
@afrokick
Copy link
Member

Yeap, stream event calls on every track. So, if you stream contains two tracks, stream event should calls twice.

@baptisteArno
Copy link

baptisteArno commented Mar 26, 2020

Please, can we handle this behavior? I can stream video but I don't have sound

@Payetus
Copy link

Payetus commented Mar 30, 2020

Still an issue

@Payetus
Copy link

Payetus commented Mar 30, 2020

Sipjs handles it this way https://sipjs.com/guides/attach-media/ by having onTrackAdded

@baptisteArno
Copy link

Please, can we handle this behavior? I can stream video but I don't have sound

I figured I was wrong. Both streams received contain audio and video. I forgot to remove the mute prop from my HTML tag...

@Payetus
Copy link

Payetus commented Apr 27, 2020 via email

@KaushikSathvara
Copy link

Anyone have working solution for these? still stream event called twice.

@ghazimuharam
Copy link

This things still have an issue as of today, anyone have an idea to deal with?

@ahmetaltun
Copy link

ahmetaltun commented Aug 28, 2020

i create an array.

const callList = [];

When i get a call or i call other users, first i check that list in onStream event and if that call not in my list, doing my stuf (add to page a video element or anything else).
Example here (i am calling other user and other user answer with a stream):

        // make a call (userId is other users peer id)
	const call = peer.call(userId, myVideoElement.srcObject, { metadata: { userId: peer.id } });
	// create a video element
	const video = createVideoElement(); // this is my custom function for create a html video element, it returns a video element.
	// call on stream
	call.on('stream', remoteStream => {
            // check call list if call not in the list then add to list and page
            if(!callList[call.peer]){
                // add stream to video element
                video.srcObject = remoteStream;
                // show on page
                showVideoElemenetOnPage(video); // this is my custom function for append video element to another element on the page
                // add call objec to global object
                callList[call.peer] = call;
            }
	});

This can solve twice run problem.

@ghazimuharam
Copy link

i create an array.

const callList = [];

When i get a call or i call other users, first i check that list in onStream event and if that call not in my list, doing my stuf (add to page a video element or anything else).
Example here (i am calling other user and other user answer with a stream):

        // make a call (userId is other users peer id)
	const call = peer.call(userId, myVideoElement.srcObject, { metadata: { userId: peer.id } });
	// create a video element
	const video = createVideoElement(); // this is my custom function for create a html video element, it returns a video element.
	// call on stream
	call.on('stream', remoteStream => {
            // check call list if call not in the list then add to list and page
            if(!callList[call.peer]){
                // add stream to video element
                video.srcObject = remoteStream;
                // show on page
                showVideoElemenetOnPage(video); // this is my custom function for append video element to another element on the page
                // add call objec to global object
                callList[call.peer] = call;
            }
	});

This can solve twice run problem.

This solve my problem, thanks

@dipanshubhola1009
Copy link

after using the above method it was still accepting twice.

const callList = [];

peer.on('call', call =>{
call.answer(myMedia);
// initialining accept boolean for every new user
var accept = true;
call.on('stream', data=> {
console.log("acceptcall");
//to accept call only once for other user
if(accept){
addvideoElement(false,data);
accept=false;
}
});
});

socket.on('user-connected', ID => {

var call = peer.call(ID,myMedia);

    call.on('stream', data => { 
        if(!callList.includes(ID)){
            console.log("user-connected");
            addvideoElement(false,data);
            callList.push(ID);
        }
        
    });

});

@KaushikSathvara
Copy link

If you get double stream issue then try to create video element before call.on('stream', data => { line. @dipanshubhola1009

@dipanshubhola1009
Copy link

Now it is working as expected

@ErickWendel
Copy link

Same problem here :( I did the work around to ignore the second event

@GuvanchBayryyyev
Copy link

GuvanchBayryyyev commented Feb 11, 2021

I have found simple solution:

let count = 0;
call.on('stream', function(remoteStream) {
     count = count + 1;
     if(count == 2){
       return
      } else {
        console.log('Received stream', remoteStream);
     }
});

@amanKumar689
Copy link

Yeap, stream event calls on every track. So, if you stream contains two tracks, stream event should calls twice.

ooo god i was confused with 48 hour thanks bro i love u

@umohangopikrishna
Copy link

If you get double stream issue then try to create video element before call.on('stream', data => { line. @dipanshubhola1009

on create video element before call.on('stream', data => { }); even though it executing two time but video is not displaying because the adding of same track is not allowed by video Element. when keeping video element inside the call.on('stream'(stream)=>{}) it will create new video element for twice.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug client related to peerjs client investigating currently being looked into
Projects
None yet
Development

No branches or pull requests