Agfdhyk

Edit:

The question was marked as too broad so I will factorize it to one simple question:

How do I play a sequence of audio files from within a web page (React actually) without small gaps between plays ?

I have an audio file (in this case mp3 but could be any format) which was split in 100 separate files by Audacity.

I stored these files in MongoDB as binary entries to fetch them later. (Files could be stored as whole in a directory on the server if the solution is based on it)

In Node.JS with simple Buffet.concat(), I managed to join the binaries and I could download the entire file as a single mp3.

The problem is, the output file was only 3 seconds long (which is a single mp3 chunk is) but was playable for the real duration even if the player was confused about 3 seconds length. Also it was ~3MB bigger that the original complete file, probably because of headers between chunks being concatenated.

My question is, how could I possibly merge audio chunks with proper headers being in the output? I know ffmpeg can do some black magic but I mostly need a Buffer output to make the file playable as a stream inside a web page without download. That point is very important.

Thanks a lot in advance :)

In the first case, you're taking an audio file and converting it into many audio files.

In the second case, you're taking many binary files (yes, they're still audio files, but you're using a process that ignores that fact) and concatenating them into a single binary file.

Most audio files formats contain a bunch of information that describe their content (channels, bit rates, etc.). Using software designed for handling audio files, to split an audio files, generates more audio files, each with their own set of descriptive data.

Trying to concatenate those files without taking their content into consideration results in a single file containing the information for several audio files. Since most audio formats aren't designed for this scenario, some players will only see the first bit and consider the rest to be garbage while other players will tell you the content is one thing while playing something else.

Treat the files the same way at both ends of the process.

Javascript doesn't have a native way of easily manipulating audio the way you want. You do have a few options though:

• Find a module that interfaces with audio software. There are a number of npm modules that use ffmpeg. Doing it this way may still not get you what you want as merging audio files is not an instant process.


• Handle the audio manipulation from within the page. You can already load and play individual audio files; create/find something that can play them in sequence without needing to stitch them together. This will allow the kind of manipulation you want. When the user wants to download a finished product: send the sequence of clip ids back to the server for processing, use the above-mentioned modules to assemble them into a single audio file, then provide that file for download.