有没有办法降低 HTML5 录制的录制音量以防止反馈？
Posted
技术标签:
【中文标题】有没有办法降低 HTML5 录制的录制音量以防止反馈？【英文标题】：Is there a way to lower the recording volume of HTML5 recording to prevent feedback? 【发布时间】：2014-10-13 13:08:49 【问题描述】：我正在使用 Recorder.js 来录制音频，但如果我不使用耳机，会有很糟糕的反馈。如果我使用我的苹果耳机，麦克风离听筒更近一点，甚至会有一点反馈。有没有办法降低麦克风/录音音量并防止反馈？
【问题讨论】：
我之前也遇到过这个问题，我认为是硬件问题。 我的回答好运吗？ 我还没有时间测试它，但链接似乎有我需要的正确信息，他们的例子没有反馈，所以我会奖励赏金并在我有后接受它测试 【参考方案1】：如果您可以访问 gain_node - 您可以控制输出扬声器音量
把它放到你的 html 中（可选）
<p>Volume</p>
<input id="volume" type="range" min="0" max="1" step="0.1" value="0.5"/>
然后执行类似于以下 U 可以访问 gain_node 的操作
document.getElementById('volume').addEventListener('change', function()
var curr_volume = this.value;
gain_node.gain.value = curr_volume;
console.log("curr_volume ", curr_volume);
);
下面我将上面捆绑到一组对 Web Audio API 的调用中，其中我有一个 UI 小部件可以在它收听您的麦克风时更改音量...在运行之前将音量 DOWN！
<html><head><meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>capture microphone then show time & frequency domain output</title>
<script type="text/javascript">
var webaudio_tooling_obj = function ()
var audioContext = new AudioContext();
console.log("audio is starting up ...");
var BUFF_SIZE_RENDERER = 16384;
var SIZE_SHOW = 3; // number of array elements to show in console output
var audioInput = null,
microphone_stream = null,
gain_node = null,
script_processor_node = null,
script_processor_analysis_node = null,
analyser_node = null;
if (!navigator.getUserMedia)
navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia ||
navigator.mozGetUserMedia || navigator.msGetUserMedia;
if (navigator.getUserMedia)
navigator.getUserMedia(audio:true,
function(stream)
start_microphone(stream);
,
function(e)
alert('Error capturing audio.');
);
else alert('getUserMedia not supported in this browser.');
// ---
function show_some_data(given_typed_array, num_row_to_display, label)
var size_buffer = given_typed_array.length;
var index = 0;
console.log("__________ " + label);
if (label === "time")
for (; index < num_row_to_display && index < size_buffer; index += 1)
var curr_value_time = (given_typed_array[index] / 128) - 1.0;
console.log(curr_value_time);
else if (label === "frequency")
for (; index < num_row_to_display && index < size_buffer; index += 1)
console.log(given_typed_array[index]);
else
throw new Error("ERROR - must pass time or frequency");
function process_microphone_buffer(event)
var i, N, inp, microphone_output_buffer;
// not needed for basic feature set
// microphone_output_buffer = event.inputBuffer.getChannelData(0); // just mono - 1 channel for now
function start_microphone(stream)
gain_node = audioContext.createGain();
gain_node.connect( audioContext.destination );
microphone_stream = audioContext.createMediaStreamSource(stream);
microphone_stream.connect(gain_node);
script_processor_node = audioContext.createScriptProcessor(BUFF_SIZE_RENDERER, 1, 1);
script_processor_node.onaudioprocess = process_microphone_buffer;
microphone_stream.connect(script_processor_node);
// --- enable volume control for output speakers
document.getElementById('volume').addEventListener('change', function()
var curr_volume = this.value;
gain_node.gain.value = curr_volume;
console.log("curr_volume ", curr_volume);
);
// --- setup FFT
script_processor_analysis_node = audioContext.createScriptProcessor(2048, 1, 1);
script_processor_analysis_node.connect(gain_node);
analyser_node = audioContext.createAnalyser();
analyser_node.smoothingTimeConstant = 0;
analyser_node.fftSize = 2048;
microphone_stream.connect(analyser_node);
analyser_node.connect(script_processor_analysis_node);
var buffer_length = analyser_node.frequencyBinCount;
var array_freq_domain = new Uint8Array(buffer_length);
var array_time_domain = new Uint8Array(buffer_length);
console.log("buffer_length " + buffer_length);
script_processor_analysis_node.onaudioprocess = function()
// get the average for the first channel
analyser_node.getByteFrequencyData(array_freq_domain);
analyser_node.getByteTimeDomainData(array_time_domain);
// draw the spectrogram
if (microphone_stream.playbackState == microphone_stream.PLAYING_STATE)
show_some_data(array_freq_domain, SIZE_SHOW, "frequency");
show_some_data(array_time_domain, SIZE_SHOW, "time"); // store this to record to aggregate buffer/file
;
(); // webaudio_tooling_obj = function()
</script>
</head>
<body>
<p>Volume</p>
<input id="volume" type="range" min="0" max="1" step="0.1" value="0.0"/>
</body>
</html>
当然不需要 UI 小部件，因为您可以通过编程控制输出音量，因此要保持静音，您可以断开增益节点或将其设置为低
【讨论】：
【参考方案2】：他们的example page (example_simple_exportwav.html) 说你应该戴耳机或调低音量。
另外，在启用麦克风输入之前，请插入耳机或 如果您想避免耳朵分裂反馈，请将音量调低！
您可以在录制过程中静音或降低扬声器的音量：
Muting a HTML5 audio element using a custom button How to mute all sound in a page with JS? How to set the loudness of HTML5 audio?我还测试了一些示例，但从未体验过使用笔记本电脑扬声器的反馈。您能否发布您的代码以便我们进行现场测试？
Record and Export Audio, Video files in browser using Web Audio API with Recorder.js - 底部演示 http://webaudiodemos.appspot.com/AudioRecorder/index.html 通过Web Audio Demos【讨论】：
以上是关于有没有办法降低 HTML5 录制的录制音量以防止反馈？的主要内容，如果未能解决你的问题，请参考以下文章
有没有办法在 mp4 中使用 ruby on rails / web / html5 录制音频