Skip to content

Choosing camera on mobile devices

The method Flashphoner.getMediaDevices() is intended to get a device cameras and microphones list. It uses navigator.mediaDevices.enumerateDevices(), and this is usually enough to get all the inputs. But it makes no difference between front and back cameras: you should parse a camera label to check what camera it is. And camera labels are usually localized in iOS Safari, so they cannot be properly parsed.

Since Web SDK build 2.0.274 the new method Flashphoner.getMobileDevices() is added to resolve the issue. This method uses facingMode constraint in navigator.mediaDevices.getUserMedia() call to properly detect the device front and back cameras:

code

    if(Browser.isAndroid() || Browser.isiOS()) {
        ...
        if (Browser.isFirefox()) {
            // Use camera selection by name in mobile Firefox browser
            ...
        } else {
            // Use camera selection by facingMode constraint on mobile devices in Chrome and Safari
            Flashphoner.getMobileDevices(null, MEDIA_DEVICE_KIND.INPUT).then((list) => {
                setSwitchableControls(list.video, "videoInput", "sendVideo");
                setSwitchableControls(list.audio, "audioInput", "sendAudio");
                switchCamEnabled = false;
            }).catch(function (error) {
                $("#notifyFlash").text("Failed to get media devices: " + error.message);
            });
        }
    } else {
        // List all the connected devices on desktop
        Flashphoner.getMediaDevices(null, true).then(function (list) {
            setSwitchableControls(list.video, "videoInput", "sendVideo");
            setSwitchableControls(list.audio, "audioInput", "sendAudio");
        }).catch(function (error) {
            $("#notifyFlash").text("Failed to get media devices: " + error.message);
        });
    }

Known issues

  1. Flashphoner.getMobileDevices() method does not work properly in mobile Firefox browser. Use Flashphoner.getMediaDevices() instead.

  2. Flashphoner.getMobileDevices() returns a video devices list containing one front camera and one back camera. Use devices identifiers from this list only to switch between cameras.