Search code examples
webrtcchromiumweb-audio-api

Use single AudioContext with AudioElement while audioElement use different output devices


I have a use-case to visualize audio output level of a single audio file when the different output devices are being selected. I took the approach of using AudioContext with audioElement, but I realize I cannot simply set different sinkIds in audioElement while it's associated with AudioContext.Code I tried is below.

`
var audioContext = this.audioContext = new $window.AudioContext();
var source = this.source = audioContext.createMediaElementSource(audioElement);
var analyser = this.analyser = audioContext.createAnalyser();
var javascriptNode = this.javascriptNode = audioContext.createScriptProcessor(1024, 1, 1);
analyser.fftSize = audioContextModelConstants.FFT_SIZE;
analyser.smoothingTimeConstant = audioContextModelConstants.SMOOTHING_TIME;

source.connect(analyser);
var gainNode = audioContext.createGain();
source.connect(gainNode);
gainNode.connect(audioContext.destination);`

Solution

  • You can't currently achieve what you want. Once your audio element is connected to an audio context, all audio is routed through the context. And an audio context doesn't support selecting an audio output device at this time.