Javascript 可视化来自远程对等连接的mediastream

Javascript 可视化来自远程对等连接的mediastream,javascript,stream,webrtc,microphone,web-audio-api,Javascript,Stream,Webrtc,Microphone,Web Audio Api,因为有几天我试图想象一个通过webrtc传输的音频流。 我们已经编写了一些视频,这些视频在正常的本地流(webaudio麦克风使用)中运行良好 然后我发现了一些非常有趣的东西,可以在不同的浏览器之间传输麦克风输入。 我们需要这样才能从一个后端为前端的所有客户端提供相同的音频数据 一切正常,一些测试表明我们能听到对方的声音。所以我认为可视化传入流也不是问题 但是:所有频率数据都是空的(零),即使我们能听到对方的声音 有人对此有解决方案或提示吗?提前谢谢 这是我分析远程频率数据的测试: 首先包括以下

因为有几天我试图想象一个通过webrtc传输的音频流。 我们已经编写了一些视频,这些视频在正常的本地流(webaudio麦克风使用)中运行良好

然后我发现了一些非常有趣的东西,可以在不同的浏览器之间传输麦克风输入。 我们需要这样才能从一个后端为前端的所有客户端提供相同的音频数据

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

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

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

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

首先包括以下文件:

webrtc-experience.com/firebase.js

webrtc-experience.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');
至少在下一次,我找到了一个简单的“解决方案”:

我在所有客户机中插入了从麦克风到耳机的男/男音频电缆。然后我读了当地的麦克风流,真是奇迹,我可以想象我听到了什么

这不是一个好的解决方案,但它起到了作用


一个问题:是否可以在javascript中以流的形式重新获取目标?那么我就不需要音频电缆了。

请注意,分析远程流应该适用于Firefox,而众所周知,它在Chrome中不起作用,请参阅

一种可能的解决方法是使用WebRTC统计API获取远程音频级别值

如果你去chrome://webrtc-internals/ 然后选择播放远程流的页面,然后其中一个ssrc_XXXX_recv将包含动态变化的audioOutputLevel值,您可以使用该值

您可以使用Chrome PeerConnection的statistics API访问该值,特别是getStats()方法

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


祝你好运!:-)

我已经发现了一个匹配的问题:听起来像是一个机会!我将在未来几周内尝试此功能-提前感谢:)