我认为这应该相当简单,但我认为我正在研究太多事情,而且没有意义。
我目前正在做什么
我正在使用Node + React创建一个Web应用程序,以便在浏览器中录制音频。我在客户端使用RecordRTC来记录用户麦克风的音频。一切都很好,花花公子,但有时用户唱完后上传音频文件需要很长时间。我想在下一步将它发送给用户之前处理这个文件,因此速度在这里是至关重要的,因为它们正在等待这种情况发生。
为了让我的用户体验更流畅,我想在开始接收来自RecordRTC的音频blob后立即启动音频上传过程。我可以访问这些blob,因为RecordRTC允许我传递一个时间片值(以ms为单位)和一个'ondatavailable'函数,它将每隔几毫秒传递一个blob。
我尝试了什么
目前我可以轻松使用FormData(),因为我只在用户唱完后才发送文件。
我想要什么
理想情况下,我想在录制开始后创建一个新的新请求,然后每次在“ondataavailable”中收到它时都会获取blob,将其发送给我的请求(一旦收到某些内容,它就会将其传送到我的服务器无限期地。一旦音频停止(我也从RecordRTC得到这个事件,所以可以控制它),我想完成/关闭我的请求,以便服务器知道它现在可以开始处理文件。作为上传过程的一部分,我还需要传入正文中的一个或两个文本数据,因此也需要处理。在服务器端,每个块都应该在服务器收到后立即可访问,这样我就可以开始创建音频文件/附加到服务器端的音频文件,并在用户完成后立即准备好进行处理他们的歌声。
注意:服务器当前设置为在npm上通过multer库查找和处理多部分上传,但我很乐意更改它以获得我想要的功能。
谢谢!
答案 0 :(得分:0)
为可能在自己的搜索中偶然发现此问题的任何人提供更新。
我们最终“滚动了自己的”自定义上传器,该上传器在客户端将音频Blob(最多5个1秒Blob)的块发送到服务器。每个请求都包含一个“请求号”,该请求号从1开始只是前一个请求号的+1。发送5个1秒Blob的原因是RecordRTC,至少在当时,它不会捕获最后的X秒数。例如。如果改用5秒的Blob,则38秒的歌曲将损失最后3秒。到达记录末尾时,它将发送最终请求(标有附加标头,以使服务器知道这是最终请求)。上传器以链接列表样式工作,以确保在发送下一个请求之前已处理了每个先前的请求。
在服务器端,这5个Blob通过FFMPEG附加到一个5秒的音频Blob中。这确实引入了外部依赖性,但是我们已经在大多数应用程序中使用了FFMPEG,因此这是一个容易的决定。产生的文件的文件名后附加了请求号。收到最终请求后,我们再次使用FFMPEG对所有接收到的文件进行最终连接,以获取最终文件。
在连接速度非常慢的情况下,我们发现可以节省60秒钟以上的时间,因此,它显着提高了该应用程序在互联网连接速度较慢时的可用性。
如果有人希望自己使用代码,请PM在这里完成。 (它还没有打磨过,但是我会在发送之前先清理一下)