Geek Answers Handbook

Make a video stream Optional in getUserMedia

In my application, a user can make calls if he can create an audio stream. Therefore, I need to access the microphone (audio stream). Without it, the application should throw an error. Video is optional. So, I call navigator.getUserMediaand set constraintsas follows:

{ audio: true, video: false }

And it gives an error when the microphone is missing, just as I need. But a side effect of this is that if the user also has access to the camera, the video is not in the stream.

But if I installed both audio, and videoin true, I would have an error in cases where users have a microphone, but they do not have access to the camera (which corresponds to my application logic) / p>

How can I make the video stream optional to receive getUserMedia?

+4
source share
2 answers

The solution I found was to call getUserMediawith the video and sound turned on, if the call failed (this means that they don’t have a camera or microphone), then you call getUserMediaagain from the callback the rejection that you provide the requesting access only to the microphone.

var failedLocalAudioAndVideoStreamCallBack = function (error) {
      getUserMedia({ audio: true, video: false }, 
      gotLocalAudioStreamCallBack, failedLocalAudioStreamCallBack )});
    }

    getUserMedia({ audio: true, video: true },
    gotLocalAudioAndVideoStreamCallBack, failedLocalAudioAndVideoStreamCallBack);

Of course, you can cope with successes and failures as you like.

NOTE. If there is no camera, a pop-up window requesting the initial camera feed (which will fail) never pops up. Thus, the user will receive only one access request (which makes this solution a little more acceptable).

+3

. , getUserMedia:

navigator.mediaDevices.enumerateDevices()
  .then(devices => {
    var cams = devices.filter(device => device.kind == "videoinput");
    var mics = devices.filter(device => device.kind == "audioinput");

    var constraints = { video: cams.length > 0, audio: mics.length > 0 };
    return navigator.mediaDevices.getUserMedia(constraints);
  })
  .then(stream => video.srcObject = stream)
  .catch(failed);

, .

, enumerateDevices, Chrome adapter.js.

: Chrome enumerateDevices.

+6

More articles:


All Articles