title: WebRTC: How do I stream Client A's video to Client B?
body: <p>I am looking into WebRTC but I feel like I'm not understanding the full picture. I'm looking at this demo project in particular: <a href="https://github.com/oney/RCTWebRTCDemo/blob/master/main.js" rel="noreferrer">https://github.com/oney/RCTWebRTCDemo/blob/master/main.js</a></p>
  
  <p>I'm having trouble understanding how I can match 2 clients so that Client A can see Client B's video stream and vice versa.</p>
  
  <p>This is in the demo:</p>
  
  <pre><code>function getLocalStream(isFront, callback) {
    MediaStreamTrack.getSources(sourceInfos =&gt; {
      console.log(sourceInfos);
      let videoSourceId;
      for (const i = 0; i &lt; sourceInfos.length; i++) {
        const sourceInfo = sourceInfos[i];
        if(sourceInfo.kind == "video" &amp;&amp; sourceInfo.facing == (isFront ? "front" : "back")) {
          videoSourceId = sourceInfo.id;
        }
      }
      getUserMedia({
        audio: true,
        video: {
          mandatory: {
            minWidth: 500, // Provide your own width, height and frame rate here
            minHeight: 300,
            minFrameRate: 30
          },
          facingMode: (isFront ? "user" : "environment"),
          optional: [{ sourceId: sourceInfos.id }]
        }
      }, function (stream) {
        console.log('dddd', stream);
        callback(stream);
      }, logError);
    });
  }
  </code></pre>
  
  <p>and then it's used like this:</p>
  
  <pre><code>socket.on('connect', function(data) {
    console.log('connect');
    getLocalStream(true, function(stream) {
      localStream = stream;
      container.setState({selfViewSrc: stream.toURL()});
      container.setState({status: 'ready', info: 'Please enter or create room ID'});
    });
  });
  </code></pre>
  
  <p>Questions:</p>
  
  <ol>
  <li><p>What exactly is <code>MediaStreamTrack.getSources</code> doing? Is this because devices can have multiple video sources (e.g. 3 webcams)?</p></li>
  <li><p>Doesn't <code>getUserMedia</code> just turn on the client's camera? In the code above isn't the client just viewing a video of himself?</p></li>
  </ol>
  
  <p>I'd like to know how I can pass client A's URL of some sort to client B so that client B streams the video coming from client A. How do I do this? I'm imagining something like this:</p>
  
  <ol>
  <li>Client A enters, joins room "abc123". Waits for another client to join</li>
  <li>Client B enters, also joins room "abc123".</li>
  <li>Client A is signaled that Client B has entered the room, so he makes a connection with Client B</li>
  <li>Client A and Client B start streaming from their webcam. Client A can see Client B, and Client B can see Client A.</li>
  </ol>
  
  <p>How would I do it using the WebRTC library (you can just assume that the backend server for room matching is created)</p>