CODEWITHSUNDEEP
javascripthtml5-audioweb-audio-apimediastreamsource
marcel
marcel

Reputation: 3272

AudioElementMediaStream to MediaStreamSource

The WebAudioApi AudioContext can create a source from a MediaStreamSource:

  const {audioCtx} = this;
  const source = audioCtx.createMediaStreamSource(mediaStream);
  source.connect(audioCtx.destination);
  source.start(audioCtx.currentTime);

The Audio-Element supports an accessible mediaStream by captureStream():

  const audio = new Audio();
  audio.src = src;
  const mediaStream = audio.captureStream();

As you can see in the docs, both streams - the audio captured stream as well as the stream param for createAudioStreamSource are MediaStreams, why isn't it working. Where's the problem how can I fix it?

Edit:

The problem is that the broser throws this error:

× Unhandled Rejection (InvalidStateError): Failed to execute 'createMediaStreamSource' on 'BaseAudioContext': MediaStream has no audio track

Upvotes: 3

Views: 2438

Answers (1)

Steve -Cutter- Blades
Steve -Cutter- Blades

Reputation: 5432

You've attached your 'src' to your audio element, but you haven't checked to see if the content has fully loaded from the server prior to acting on it. You can't capture the stream if it hasn't finished downloading to the browser yet, kind of like not being able to display an image source until it's completely in the browser. Any process against the source you'll have to place inside an onload handler. (And you may want to use a <source> element in your <audio> element instead.)

Upvotes: 2

Related Questions