javascript - Adding an AudioTrack while the MediaRecorder is in state 'recording' - Stack Overflow

admin管理员组

文章数量:1023220

Im trying to add mediaTrack to the mediaStream while MediaRecorder is in state 'recording'

The code for adding a new track is the following:

activeStream.addTrack(newAudioTrack)

After that the event (onstop) was triggered. How can I avoid this?

Im trying to add mediaTrack to the mediaStream while MediaRecorder is in state 'recording'

The code for adding a new track is the following:

activeStream.addTrack(newAudioTrack)

After that the event (onstop) was triggered. How can I avoid this?

• javascript
• webrtc
• webapi
• web-mediarecorder

Share Improve this question Follow asked Feb 22, 2021 at 14:48 Andrew MedvedevAndrew Medvedev 6511 silver badge88 bronze badges 2

• Hi Andrew, does the answer over here solve your question as well? stackoverflow./questions/57838283/… – chrisguttandin Commented Feb 22, 2021 at 17:26
• Thank you for your link, but I still have don`t understand how i can replace the track during the recording. Tracks merging with AudioContext it's OK, but before Recording, is not it? – Andrew Medvedev Commented Feb 22, 2021 at 19:05

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 8

You can use an AudioContext to create a fixed MediaStream that you can pass to the MediaRecorder. This allows you to change the input when recording.

const audioContext = new AudioContext();
const mediaStreamAudioDestinationNode = new MediaStreamAudioDestinationNode(audioContext);
const mediaRecorder = new MediaRecorder(mediaStreamAudioDestinationNode.stream);

Let's say you have a MediaStream called initialMediaStream. You could connect it like that:

const mediaStreamAudioSourceNode = new MediaStreamAudioSourceNode(
    audioContext,
    { mediaStream: initialMediaStream }
);

mediaStreamAudioSourceNode.connect(mediaStreamAudioDestinationNode);

You can then start recording the initialMediaStream.

mediaRecorder.start();

Later on you can replace the initialMediaStream with anotherMediaStream.

const anotherMediaStreamAudioSourceNode = new MediaStreamAudioSourceNode(
    audioContext,
    { mediaStream: anotherMediaStream }
);

anotherMediaStreamAudioSourceNode.connect(mediaStreamAudioDestinationNode);
mediaStreamAudioSourceNode.disconnect();

You could even use GainNodes to apply a cross-fade between the two streams if that's what you want.

Im trying to add mediaTrack to the mediaStream while MediaRecorder is in state 'recording'

The code for adding a new track is the following:

activeStream.addTrack(newAudioTrack)

After that the event (onstop) was triggered. How can I avoid this?

Im trying to add mediaTrack to the mediaStream while MediaRecorder is in state 'recording'

The code for adding a new track is the following:

activeStream.addTrack(newAudioTrack)

After that the event (onstop) was triggered. How can I avoid this?

• javascript
• webrtc
• webapi
• web-mediarecorder

Share Improve this question Follow asked Feb 22, 2021 at 14:48 Andrew MedvedevAndrew Medvedev 6511 silver badge88 bronze badges 2

• Hi Andrew, does the answer over here solve your question as well? stackoverflow./questions/57838283/… – chrisguttandin Commented Feb 22, 2021 at 17:26
• Thank you for your link, but I still have don`t understand how i can replace the track during the recording. Tracks merging with AudioContext it's OK, but before Recording, is not it? – Andrew Medvedev Commented Feb 22, 2021 at 19:05

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 8

You can use an AudioContext to create a fixed MediaStream that you can pass to the MediaRecorder. This allows you to change the input when recording.

const audioContext = new AudioContext();
const mediaStreamAudioDestinationNode = new MediaStreamAudioDestinationNode(audioContext);
const mediaRecorder = new MediaRecorder(mediaStreamAudioDestinationNode.stream);

Let's say you have a MediaStream called initialMediaStream. You could connect it like that:

const mediaStreamAudioSourceNode = new MediaStreamAudioSourceNode(
    audioContext,
    { mediaStream: initialMediaStream }
);

mediaStreamAudioSourceNode.connect(mediaStreamAudioDestinationNode);

You can then start recording the initialMediaStream.

mediaRecorder.start();

Later on you can replace the initialMediaStream with anotherMediaStream.

const anotherMediaStreamAudioSourceNode = new MediaStreamAudioSourceNode(
    audioContext,
    { mediaStream: anotherMediaStream }
);

anotherMediaStreamAudioSourceNode.connect(mediaStreamAudioDestinationNode);
mediaStreamAudioSourceNode.disconnect();

You could even use GainNodes to apply a cross-fade between the two streams if that's what you want.

本文标签： javascriptAdding an AudioTrack while the MediaRecorder is in state 39recording39Stack Overflow