在 Firefox 中控制 Video/Audio 流的音量增益
Control volume gain for Video/Audio stream in Firefox
我正在尝试使用 Firefox 的 MediaRecorder API 录制 Video/Audio 文件。
当我使用网络音频 API 创建节点时(源 -> 增益 -> 目标)
录制文件的输出仅为音频,因为来自目标节点的 return 流仅为音频流,参考本文档
https://developer.mozilla.org/en-US/docs/Web/API/MediaStreamAudioDestinationNode
关于在目标输出中获取 Audio/video 流以记录 audio/video 而不是仅音频的任何建议。
var mediastream;
var ctx = new AudioContext();
var mediaStreamSource = ctx.createMediaStreamSource(mediaStream);
var destination = ctx.createMediaStreamDestination();
ObjectStore.VolumeGainNode = ctx.createGain();
ObjectStore.VolumeGainNode.gain.value = 0.5;
mediaStreamSource.connect(ObjectStore.VolumeGainNode);
ObjectStore.VolumeGainNode.connect(destination);
mediaStream = destination.stream;
您需要一个由 gUM 视频轨道和 gain-modified 音频轨道组成的流。
按照标准,Firefox 允许您使用 stream.addTrack
和 stream.removeTrack
修改流中的曲目,以及使用 new MediaStream([tracks])
.[=16= 的曲目组成新的流]
这可以让您通过将 gUM 音轨替换为您的 gain-manipulated 音轨来解决您的问题:
var constraints = { video: true, audio: true };
var start = () => navigator.mediaDevices.getUserMedia(constraints)
.then(stream => modifyGain(video.srcObject = stream, 0.5))
.catch(e => console.error(e));
var modifyGain = (stream, gainValue) => {
var audioTrack = stream.getAudioTracks()[0];
var ctx = new AudioContext();
var src = ctx.createMediaStreamSource(new MediaStream([audioTrack]));
var dst = ctx.createMediaStreamDestination();
var gainNode = ctx.createGain();
gainNode.gain.value = gainValue;
[src, gainNode, dst].reduce((a, b) => a && a.connect(b));
stream.removeTrack(audioTrack);
stream.addTrack(dst.stream.getAudioTracks()[0]);
};
这是 fiddle(Firefox 44 或更新版本):https://jsfiddle.net/7wd2z8rz/
再次使用 MediaRecorder:https://jsfiddle.net/j33xmkcq/
我正在尝试使用 Firefox 的 MediaRecorder API 录制 Video/Audio 文件。
当我使用网络音频 API 创建节点时(源 -> 增益 -> 目标)
录制文件的输出仅为音频,因为来自目标节点的 return 流仅为音频流,参考本文档 https://developer.mozilla.org/en-US/docs/Web/API/MediaStreamAudioDestinationNode
关于在目标输出中获取 Audio/video 流以记录 audio/video 而不是仅音频的任何建议。
var mediastream; var ctx = new AudioContext(); var mediaStreamSource = ctx.createMediaStreamSource(mediaStream); var destination = ctx.createMediaStreamDestination(); ObjectStore.VolumeGainNode = ctx.createGain(); ObjectStore.VolumeGainNode.gain.value = 0.5; mediaStreamSource.connect(ObjectStore.VolumeGainNode); ObjectStore.VolumeGainNode.connect(destination); mediaStream = destination.stream;
您需要一个由 gUM 视频轨道和 gain-modified 音频轨道组成的流。
按照标准,Firefox 允许您使用 stream.addTrack
和 stream.removeTrack
修改流中的曲目,以及使用 new MediaStream([tracks])
.[=16= 的曲目组成新的流]
这可以让您通过将 gUM 音轨替换为您的 gain-manipulated 音轨来解决您的问题:
var constraints = { video: true, audio: true };
var start = () => navigator.mediaDevices.getUserMedia(constraints)
.then(stream => modifyGain(video.srcObject = stream, 0.5))
.catch(e => console.error(e));
var modifyGain = (stream, gainValue) => {
var audioTrack = stream.getAudioTracks()[0];
var ctx = new AudioContext();
var src = ctx.createMediaStreamSource(new MediaStream([audioTrack]));
var dst = ctx.createMediaStreamDestination();
var gainNode = ctx.createGain();
gainNode.gain.value = gainValue;
[src, gainNode, dst].reduce((a, b) => a && a.connect(b));
stream.removeTrack(audioTrack);
stream.addTrack(dst.stream.getAudioTracks()[0]);
};
这是 fiddle(Firefox 44 或更新版本):https://jsfiddle.net/7wd2z8rz/
再次使用 MediaRecorder:https://jsfiddle.net/j33xmkcq/