4

I want to use multiple USB camera with Web RTC.

For ex) https://apprtc.appspot.com/?r=93443359

This application is web RTC sample. I can connect to another machine, but I have to disconnect once to change the camera.

What I want to is,

1.Use two camera at the same time on the same screen. 2.(if 1 is not possible),I want to switch the camera without disconnecting current connection

Does anyone have information about how to use two camera on Web RTC?

whitebear
  • 11,200
  • 24
  • 114
  • 237

2 Answers2

4

call getUserMedia twice and change the camera input in between

Silvia
  • 543
  • 5
  • 5
4

You can use constraints to specify which camera to use and you can have both of them displayed in one page as well. To specify which camera to use take a look at the following snippet (only works on Chrome 30+):

getUserMedia({
  video: {
    mandatory: {
      sourceId: webcamId,
      ...
    }
  }, 
  successCallback,
  failCallback);

The webcamId you can get by:

MediaStreamTrack.getSources(function(sources){
  var cams = _.filter(sources, function(e){ //only return video elements 
    return e.kind === 'video';
  });
  var camIds = _.map(cams, function (e) { // return only ids
    return e.id;
  });
});

In the snippet above I've used underscore methods filter and map.

More information on:

Matyas
  • 13,473
  • 3
  • 60
  • 73
  • [filter](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/filter) and [map](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/map) are available in modern browser. – Guillaume Massé Sep 04 '14 at 15:12
  • true. i mean where getUserMedia is available they should work as well. I'm just used to using underscore – Matyas Sep 04 '14 at 16:47