可视化来自远程对等连接的媒体流

visualize mediastream which is coming from a remote peer connection

本文关键字:连接 媒体 对等 程对等 可视化      更新时间:2023-09-26

几天以来,我一直在尝试可视化通过webrtc传入的音频流。我们已经编写了一些视觉效果,这些视觉效果适用于正常的本地流(网络音频麦克风使用)。

然后我在 https://github.com/muaz-khan/WebRTC-Experiment/tree/master/上发现了一些非常有趣的东西,用于在不同浏览器之间流式传输麦克风输入。我们需要它为前端中的所有客户端从一个后端获得相同的音频数据。

一切正常,一些测试表明我们可以听到对方的声音。所以我认为可视化传入流也不是问题。

但是:所有频率数据都是空的(零),即使我们可以听到对方的声音。

有人对此有解决方案或提示吗?提前感谢!

这是我分析远程频率数据的测试:

首先包括这些文件:

webrtc-experiment.com/firebase.js

webrtc-experiment.com/one-to-many-audio-broadcasting/meeting.js

        var meeting = new Meeting('test');
        var audioContext = new window.webkitAudioContext();
        var analyser = audioContext.createAnalyser();
        // on getting local or remote streams
        meeting.onaddstream = function(e) {
            console.log(e.type);
            console.log(e.audio);
            console.log(e.stream);
            if(e.type === 'local')
            {
                //try it with the local stream, it works!
            }
            else
            {
                var source = audioContext.createMediaStreamSource(e.stream);
                source.connect(analyser);
                analyser.connect(audioContext.destination);
                console.log(analyser.fftSize);
                console.log(analyser.frequencyBinCount);
                analyser.fftSize = 64;
                console.log(analyser.frequencyBinCount);
                var frequencyData = new Uint8Array(analyser.frequencyBinCount);
                analyser.getByteFrequencyData(frequencyData);
                function update() {
                    requestAnimationFrame(update);
                    analyser.getByteFrequencyData(frequencyData);
                    console.log(frequencyData);
                };
                update();
            }
        };
        meeting.check();
        meeting.setup('test');

请注意,分析远程流应该适用于 Firefox,并且已知在 Chrome 中不起作用,请参阅 http://code.google.com/p/chromium/issues/detail?id=241543

一种可能的解决方法是使用 WebRTC 统计信息 API 获取远程音频电平值。

如果您转到 chrome://webrtc-internals/然后选择播放远程流的页面,则其中一个ssrc_XXXX_recv将包含您可以使用的动态更改的 audioOutputLevel 值。

您可以使用Chrome PeerConnection的统计信息API访问该值,特别是getStats()方法。

一个可能的缺点可能是,这是用户从视频/音频元素听到的实际声音的值,因此如果用户静音或更改媒体元素的音量,它将影响 audioOutputLevel 值。

祝你好运! :-)

我至少在下次找到了一个简单的"解决方案":

我已经在所有客户端中将一根公/公音频电缆从麦克风插入耳机。然后我阅读了本地麦克风流,真是奇迹,我可以想象我听到的内容。

不是一个好的解决方案,但它正在完成这项工作。

一个问题:是否可以在javascript中将目标重新抓取为流?那我就不需要音频线了。