Force getUserMedia re-prompt when using HTTPS on Firefox

Question

I am making a simple app with two webcams that needs to work only on latest Firefox. Locally it works fine:

the user is prompted for the access to the camera
the user selects one camera
the user is prompted again
the user selects the second camera
both streams work fine

However, when I upload it to the server which serves the page through HTTPS, the access from the first camera is remembered and I just get two of the same streams.

Is there a way to force re-prompting on HTTPS so that the user can select the other camera, as well?

This is my code:

    function handleSuccess1(stream) {
      video1.srcObject = stream;

      navigator.mediaDevices.getUserMedia(constraints).
        then(handleSuccess2).catch(handleError);
    }

    function handleSuccess2(stream) {
      // this gets called automatically with the first stream
      // without re-prompting the user
      video2.srcObject = stream;
    }

    const constraints = {
      video: true
    };

    function handleError(error) {
      console.error(error);
    }

    navigator.mediaDevices.getUserMedia(constraints).
        then(handleSuccess1).catch(handleError);

score 1 · Accepted Answer · answered Jun 05 '18 at 18:48

1

Use navigator.mediaDevices.enumerateDevices() to list the available cameras and/or microphones.

You can read about it in more detail here: https://developer.mozilla.org/en-US/docs/Web/API/MediaDevices/enumerateDevices

answered Jun 05 '18 at 18:48

Iter Ator

8,226
20
73
164

If I got it right, then I can use the device IDs as constraints in `getUserMedia`? – dnmh Jun 06 '18 at 19:11
1

Yes, pass `deviceId` into `getUserMedia` like in this example: https://stackoverflow.com/a/33770656 – Iter Ator Jun 07 '18 at 09:57

Force getUserMedia re-prompt when using HTTPS on Firefox

1 Answers1