如何将音频从 Three.JS AudioContext 连接到 MediaStream

Question

我正在从 canvas 实例化 MediaStream。我需要将来自 Three.js.

的音频流连接到此流

我尝试了很多东西，但最简洁的是提供的代码。是否添加了流但音频只是听不见？

const context: AudioContext = ThreeAudioContext.getContext();
const destination = context.createMediaStreamDestination();
const source = context.createMediaStreamSource(destination.stream);
source.connect(destination);
stream.addTrack(destination.stream.getAudioTracks()[0]);

我也试过这个，看看音频是否已连接，但我仍然听不到任何声音。

const context: AudioContext = ThreeAudioContext.getContext();
const destination = context.createMediaStreamDestination();
const source = context.createMediaStreamSource(destination.stream);

const gainNode = context.createGain();
gainNode.gain.value = 1;

source.connect(gainNode);
gainNode.connect(destination);
stream.addTrack(destination.stream.getAudioTracks()[0]);

我想听听来自 Three.JS 的音频，但我听不到任何声音。我在游戏中可以调节音量。这会影响事情吗？我应该注意，我首先调用 canvas.captureStream() ，然后执行此 "track addition" 然后实例化记录器。

Answer 1

FuTuRe 中的开发者：

const context: AudioContext = ThreeAudioContext.getContext();
const destination = context.createMediaStreamDestination();
this.audioListener.getInput().connect(destination);
this.backgroundGainNode.connect(destination);
stream.addTrack(destination.stream.getAudioTracks()[0]);

简而言之，要将音频连接到 MediaRecorder，调用 createMediaStreamDestination 并将 gainNode（音量节点）连接到新创建的目标。然后，将曲目添加到流中。

我遇到过几次小问题： - 您连接的所有增益节点都需要处于相同的音频环境下。 - 如果你想连接音频到流，即使它可能听不见，你需要创建一个独立的GainNode。

当然，我说 GainNode 是因为您可能正在使用不同类型的 AudioNode，但我假设 95% 的人只想播放音频，除了音量之外没有任何改变。

如何将音频从 Three.JS AudioContext 连接到 MediaStream

How to connect audio to MediaStream from Three.JS AudioContext

javascript

three.js

web-audio-api