I have a JS-based web gui that uses WebRTC for audio exchange with a server. The WebRTC negotiation works fine, and with a single set of audio tracks (incoming and outgoing) the audio components work fine.
However I've found an issue where I can't add more than the first received track to my web audio context.
According to the documentation, the RTCTrackEvent
event for my WebRTC connection returns an event
that contains both event.streams
and event.track
. The streams
object will always be the same for a single RTC connection (as far as I can tell), while the track
object is the unique track I'm trying to play.
I figured this out because I was originally calling audioCtx.createMediaStreamSource(event.streams[0])
for each received track, thinking that the streams object contained the new track audio. However, that just ended up with multiple copies of the first track playing on top of each other. See the "track ordering" section here for the reason behind that.
The proper way to add & play the new track (as far as I can tell) would be to call createMediaStreamTrackSource(event.track)
and connect the resulting node to my web audio flowgraph. However, this function is only supported in Firefox as of right now. Does that mean there's truly no way to add additional received tracks from a WebRTC connection to a web audio flowgraph on other browsers? That seems unlikely. Who here knows the secret trick to making this work?