javascript - 如何从 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()，然后执行此“轨道添加”，然后实例化记录器。

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% 的人只是希望播放音频而不需要对音量进行任何更改。