分析声音流而不重复它

时间:2017-02-18 17:29:18

标签: javascript audio webrtc

我有一个我通过WebRTC获得的音频流。我想分析它,并将以下代码放在一起以直观地显示垃圾箱。

<div id="bins">
</div>
<style>
#bins {
    position: fixed;
    top: 20%;
    width: 100%;
    height: 40%;
    -webkit-transition: 0.1s ease all;
}

.bin {
    background-color: blue;
    height: 100%;
    width: 2px;
    float: left;
}

</style>
<script>
function mediaAnalyze () {
    var audio = webrtc.localStreams[0];
    audioCtx = new AudioContext();
    analyzer = audioCtx.createAnalyser();
    source = audioCtx.createMediaStreamSource(audio);
    source.connect(analyzer);
    analyzer.connect(audioCtx.destination);
    analyzer.fftSize = 128;

    var frequencyData = new Uint8Array(analyzer.frequencyBinCount);

    var bins = [];
    frequencyData.forEach(function(e) {
        var e = document.createElement('div');
        e.classList.add('bin');
        document.getElementById('bins').appendChild(e);
        bins.push(e);
    });
    function renderFrame() {
        analyzer.getByteFrequencyData(frequencyData);
        frequencyData.forEach(function (data, index) {
            bins[index].style.height = ((data * 100) / 256) + "%";
        });
        requestAnimationFrame(renderFrame);
    }
    renderFrame();
};
mediaAnalyze();
</script>

分析仪按预期工作,除了我通过激活它听到反馈。我猜它是由于我正在创建的AudioContext。如何在保持原始状态的同时禁用重复音频/反馈(因为我需要通过WebRTC传输)?

1 个答案:

答案 0 :(得分:2)

不要将分析仪连接到目的地。只是评论

//analyzer.connect(audioCtx.destination);

它应该停止反馈enter image description here