JavaScript媒体源API-爆竹音频

有没有人对MediaSource API和音频流有经验

我正在尝试为网络研讨会制作一个web应用程序我已经完成的工作：

1) On the streamer side I create a media stream from mic input, pass
it to the media recorder.

2) From media recorder I get blob each 5 seconds and through
WebSockets send it to the server and then to the participants.

3) On the participant side I make an array buffer from each blob
(using arrayBuffer() method on the blob) and pass it to the Media
Source appendBuffer() method.

4) I try to play.

现在，问题出在哪里…

一切都很好，但从媒体源缓冲区通过标签播放的声音是噼啪作响。我不是说块之间的间隙。它的频率已经不一样了，有时会发出更多的爆裂声，有时会发出更少的爆裂声，或者根本不发出爆裂声

我调试了好几个小时，发现仅仅播放水滴（在拖缆和参与者端）是没有裂纹的

所以我想问题要么在于将blob转换为数组缓冲区，要么在于将其附加到媒体源。实际上，我试图将数组缓冲区转换回blob，然后尝试播放，但没有出现爆裂声。问题似乎在加载到媒体源缓冲区后出现

我在互联网上找不到任何类似的问题或文章，而且我认为文档非常薄弱，所以我希望这里的人能够帮助我

我也在使用MediaSource进行网络摄像头视频流——视频绝对没问题，音频很脆，但比只有音频流的情况下要小得多

一些技术参数：

1) On the streamer side I create a media stream from mic input, pass
it to the media recorder.

2) From media recorder I get blob each 5 seconds and through
WebSockets send it to the server and then to the participants.

3) On the participant side I make an array buffer from each blob
(using arrayBuffer() method on the blob) and pass it to the Media
Source appendBuffer() method.

4) I try to play.

MediaStream和MediaRecorder使用44100 Hz采样率（当我试图找出问题所在时，我也尝试了其他采样率），MediaRecorder的输出是带有Opus编解码器的音频/webm。MediaSource需要完全相同的媒体类型和编解码器

我为您录制了一段显示问题的视频。在第一部分中，我充当拖缆，然后作为参与者播放，最后我向您展示blob在转换为阵列缓冲区并附加到缓冲区之前没有问题

---

非常感谢您的建议！非常感谢

如果你都是在同一个背景下做的呢？（也就是说，没有网络，只有麦克风->媒体录制器->媒体源。如果你愿意，这里有这样一个设置：我的设备上没有任何裂缝。谢谢你的评论！奇怪…你的小提琴也有同样的问题。看起来问题出在我的设备或浏览器上。但我在Chrome和Edge上，甚至在另一台计算机上都试过了，没有任何改变-无论我在哪里尝试，我都遇到了这个问题。你知道吗？如果你都是在同一个背景下做的呢？（也就是说，没有网络，只有麦克风->媒体录制器->媒体源。如果你愿意，这里有这样一个设置：我的设备上没有任何裂缝。谢谢你的评论！奇怪…你的小提琴也有同样的问题。看起来问题出在我的设备或浏览器上。但我在Chrome和Edge上，甚至在另一台计算机上都试过了，没有任何改变-无论我在哪里尝试，我都有这个问题，知道吗？