Search code examples
javascriptnode.jsfilestreammediarecorderchunks

Merge MediaRecorder chunks into a single video file with NodeJS


I'm trying to record a stream with MediaRecorder API and sending the available chunks to the server with Socket.io. I'm getting the chunks in the backend and it successfully merges to a single file, but the issue is only the first chunk is playable.

Here is my code,

Front end:

recorder = new MediaRecorder(stream, {
      mimeType: 'video/webm;codecs=vp8',
    });

    recorder.start(1000);

    recorder.ondataavailable = function(e) {
      if (e.data && e.data.size > 0) {
        socket.emit("recordedChunk", {
          room: room,
          chunk: e.data
        });
      }
    }

Back end:

const fileStream = fs.createWriteStream('./recording/test.webm', { flags: 'a' });

socket.on('recordedChunk', function (data) {
    fileStream.write(Buffer.from(new Uint8Array(data.chunk)));
});

Please tell me what I'm doing wrong or is there any other method to achieve what I want? Thanks in advance!


Solution

  • I got the solution! I was starting the recorder from both the users (caller and callee). It was creating some conflicts. Now I placed a condition that only the offerer will start recording. Now it's working just fine.