How to select audioOutput with OpenTok

Question

I am building a simple WebRTC app with OpenTok. I need to be able to select camera, audio input and audio output. Currently that doesn\'t s

Answer 1

Disclosure, I'm an employee at TokBox :). OpenTok does not currently provide a way to specify the audio output device. This is still an experimental API and only works in Chrome. When the API is standardised and has wider browser support we will make it easier.

In the meantime, it's pretty easy to do this using native WebRTC. There is a good sample for this at https://webrtc.github.io/samples/src/content/devices/multi/ the source code can be found at https://github.com/webrtc/samples/blob/gh-pages/src/content/devices/multi/js/main.js

In summary you use the enumerateDevices method as you found. Then you use the setSinkId() method on the video element https://developer.mozilla.org/en-US/docs/Web/API/HTMLMediaElement/setSinkId

You can get access to the videoElement by listening to the videoElementCreated event on the subscriber like so:

subscriber.on('videoElementCreated', (event) => {
  if (typeof event.element.sinkId !== 'undefined') {
    event.element.setSinkId(deviceId)
    .then(() => {
      console.log('successfully set the audio output device');
    })
    .catch((err) => {
      console.error('Failed to set the audio output device ', err);
    });
  } else {
    console.warn('device does not support setting the audio output');
  }
});