pitbull2k4 Posts - Answer Overflow

pitbull2k4

•Created by pitbull2k4 on 3/30/2025 in #membrane-help

WebRTC - Add Track to running PeerConnection

I have started out with the Nexus WebRTC example app (https://github.com/elixir-webrtc/apps/tree/master/nexus). Instead of automatically starting the stream, I am now running createPeerConnection() and joinChannel() without starting any local streams. I have then added a button that when pressed, should start the local webcam stream and broadcast it to other peers. On button press I execute:

async function setupLocalMedia() {
  console.log('Setting up local media stream');
  // ask for permissions
  await navigator.mediaDevices.getUserMedia({
    video: true,
    audio: true,
  }).then((stream) => {
    console.log('Adding conference local tracks to peer connection');
    stream.getTracks().forEach((track) => {
      pc.addTrack(track);
      console.log("Added local stream:", track)
    });
  })
}

async function setupLocalMedia() {
  console.log('Setting up local media stream');
  // ask for permissions
  await navigator.mediaDevices.getUserMedia({
    video: true,
    audio: true,
  }).then((stream) => {
    console.log('Adding conference local tracks to peer connection');
    stream.getTracks().forEach((track) => {
      pc.addTrack(track);
      console.log("Added local stream:", track)
    });
  })
}

Which according to the docs will then raise a "onnegotiationneeded" event, which i've bound to the peer connection like so:

pc.onnegotiationneeded = async () => {
  await pc.setLocalDescription(await pc.createOffer());
  channel.push('video-offer', { body: pc.localDescription } );
}

pc.onnegotiationneeded = async () => {
  await pc.setLocalDescription(await pc.createOffer());
  channel.push('video-offer', { body: pc.localDescription } );
}

Then I'm listening for the 'video-offer' event on the channel:

channel.on('video-offer', async (payload) => {
  console.log(payload)
  if (payload.description) {
    await pc.setRemoteDescription(payload.description);
    if (payload.description.type == "offer") {
      await pc.setLocalDescription(await pc.createAnswer());
      channel.push('video-offer', { description: pc.localDescription });
    }
  } else if (candidate) await pc.addIceCandidate(candidate);
})

channel.on('video-offer', async (payload) => {
  console.log(payload)
  if (payload.description) {
    await pc.setRemoteDescription(payload.description);
    if (payload.description.type == "offer") {
      await pc.setLocalDescription(await pc.createAnswer());
      channel.push('video-offer', { description: pc.localDescription });
    }
  } else if (candidate) await pc.addIceCandidate(candidate);
})

The problem is that the 'onnegotiationneeded' callback will crash upon "channel.push" for no clear reason, I have 'channel.onError' bound, but the error is just an empty object. Subsequently the other peer never executes the 'video-offer' callback because it never arrives. Has anyone got this scenario working before with the nexus example?

8 replies

Gaming

Programming