Joining multiple audio files into a single audio file in client side

Question

We are building a exercise app using ionic framework, which need to play multiple audio files in sequence with specific interval between each audio file. We got this working

Answer 1

Client-side javascript cannot do that, but it's possible on server-side.

Basic technically steps:

• send those files to server
• server does whatever you want and sends result back

If you are using node.js it's pretty easy

• send files to server using multer
• modify files server-side using node-stream and send back

This article describes basic mp3 file concatenation on node.js

But if you still want client-side. Theoretically this should work.

Note, this is very hackish way, you might hit many restrictions (application speed, battery consumption, local storage limit, etc) and you still will not have single file, but single format.

• Convert files to base64 using btoa, example

And use custom format like

var CustomFile = function(array_of_base64_files){
    var prepared_files = [];
    for (var i = 0; i < array_of_base64_files.length; i++) {
        var file = array_of_base64_files[i];
        prepared_files.push({
            created: Date.now(),
            order: i,
            base64: file
        });
    };
    this.export = function(){
        return prepared_files;
    }
};

• Save it to browser by using PouchDB, it has some limits which you can read in docs
• When you want to play it, get back CustomFile from pouchdb
• decode those base64 to file and use window.URL.createObjectURL(formBlob); so that HTML5 Audio can play it