将数据(blob)连续加载到node.js

时间:2018-03-20 07:34:38

标签: javascript node.js audio fetch

我认为这应该相当简单,但我认为我正在研究太多事情,而且没有意义。

我目前正在做什么

我正在使用Node + React创建一个Web应用程序,以便在浏览器中录制音频。我在客户端使用RecordRTC来记录用户麦克风的音频。一切都很好,花花公子,但有时用户唱完后上传音频文件需要很长时间。我想在下一步将它发送给用户之前处理这个文件,因此速度在这里是至关重要的,因为它们正在等待这种情况发生。

为了让我的用户体验更流畅,我想在开始接收来自RecordRTC的音频blob后立即启动音频上传过程。我可以访问这些blob,因为RecordRTC允许我传递一个时间片值(以ms为单位)和一个'ondatavailable'函数,它将每隔几毫秒传递一个blob。

我尝试了什么

目前我可以轻松使用FormData(),因为我只在用户唱完后才发送文件。

  1. 我的第一个想法是找到一个类似Fetch API的例子,其使用方式类似于我所追求的方式。有很多例子,但是所有这些例子都将源文件视为已经可用,但是因为我想在它们到来时不断添加blob(无法预先确定这些可能会何时停止,因为用户可能会决定尽早停止唱歌过程)这看起来并不乐观。
  2. 然后我考虑了一个'自己编写'的过程,这个过程会产生很多请求而不是尝试一个长连续样式的请求。这将涉及为每个请求附加唯一标识符,并让服务器将每个块连接到ID匹配的位置。但是,我不确定未来在多服务器环境中会有多么灵活,更不用说处理丢弃的连接等,并且没有真正的方法告诉服务器在用户中止事件的情况下废弃所有内容例如关闭标签/网页等。
  3. 最后,在承认可能是我的Google Fu让我失望之前,我调查了NPM之类的内容,但没有成功。
  4. 我想要什么

    理想情况下,我想在录制开始后创建一个新的新请求,然后每次在“ondataavailable”中收到它时都会获取blob,将其发送给我的请求(一旦收到某些内容,它就会将其传送到我的服务器无限期地。一旦音频停止(我也从RecordRTC得到这个事件,所以可以控制它),我想完成/关闭我的请求,以便服务器知道它现在可以开始处理文件。作为上传过程的一部分,我还需要传入正文中的一个或两个文本数据,因此也需要处理。在服务器端,每个块都应该在服务器收到后立即可访问,这样我就可以开始创建音频文件/附加到服务器端的音频文件,并在用户完成后立即准备好进行处理他们的歌声。

    注意:服务器当前设置为在npm上通过multer库查找和处理多部分上传,但我很乐意更改它以获得我想要的功能。

    谢谢!

1 个答案:

答案 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在这里完成。 (它还没有打磨过,但是我会在发送之前先清理一下)