Streams : Select media devices

Here is a description of the different steps to select a media device (mic, camera) to create a stream

Create and register a UserAgent

Check our tutorial on registration if needed to create the userAgent and register. Please note that registration is not mandatory to access ua.getUserMediaDevices().

Add events listeners on UserAgent about "mediaDeviceChanged"

When this event occur, you simply have to call the method ua.getUserMediaDevices() to get an updated devices list and update this list on your web page.

        ua.on('mediaDeviceChanged', function (invitation) {
            //Listen for mediaDeviceChanged event to update devices list
            console.log('mediaDeviceChanged');
            var res = ua.getUserMediaDevices();
            updateDeviceList (res); //This is the function to display the devices list in the page. Check our sample source code for more details
        });
    

Create the stream using selected device

Use audioInputId and videoInputId on createStreamOptions to set the devices to use :

        var createStreamOptions = {};
        createStreamOptions.audioInputId = selectMic.value;
        createStreamOptions.videoInputId = selectCamera.value;
        ua.createStream(createStreamOptions)
            .then(function (stream) {
                // Stream is available
                [...]
            })
            .catch(function (err) {
                console.error('create stream error', err);
             });
    

apiRTCMediaDeviceDetectionEnabled option

In WebRTC API, ondevicechange event is defined to be informed when the set of media devices, available to the User Agent, has changed. This event is not supported on all browsers/ devices (Chrome on Android or Safari). We have added a processing on ApiRTC to support this detection when event is not supported. You simply have to activate the option when creating UserAgent :

- apiRTCMediaDeviceDetectionEnabled : Used to enable media device detection on apiRTC when event is not managed by browser (Ex : mediaDeviceChanged not supported on Chrome/Android) - apiRTCMediaDeviceDetectionDelay : Used to define the delay of Media Device detection. Check apiRTCMediaDeviceDetectionEnabled. Default value is 10000

        var ua = new apiRTC.UserAgent({
            uri: 'apzkey:myDemoApiKey',
            apiRTCMediaDeviceDetectionEnabled : true, //This option can be use on Chrome/Android or Safari as event ondevicechange is not supported on these browsers
            apiRTCMediaDeviceDetectionDelay : 7000
        });
    

Live Demo