Using ffmpeg to merge video segments created by the MediaRecorder API

Question

I am recording a live video from a webcam using mediarecorder API un chunks of 3 seconds:

startButton.addEventListener('click', () => {
navigator.mediaDevices.getUserMedia({
    video: {
        width: 1280,
        height: 720,
        frameRate: { ideal: 30, max: 30 }
    }
})
    .then(stream => {
        video.srcObject = stream;
        mediaRecorder = new MediaRecorder(stream, { mimeType: 'video/webm' });
        mediaRecorder.ondataavailable = async (event) => {
            const blob = new Blob([event.data], { type: 'video/mp4' });
            const formData = new FormData();
            formData.append('segment', blob, `segment${segmentNumber}.mp4`);

            // When a new video segment is ready
            fetch('http://localhost:3000/upload', {
                method: 'POST',
                body: formData
            })
                .then((response) => response.text())
                .then((result) => {
                    console.log('Upload result:', result);
                })
                .catch((error) => {
                    console.error('Error uploading video segment:', error);
                });
            //Upload data to mysql
            fetch('upload.php', {
                method: 'POST',
                body: formData
            })
                .then(response => response.text())
                .then(result => {
                    console.log('Upload result to MYSQL:', result);
                })
                .catch(error => {
                    console.error('Error uploading video segment to MYSQL:', error);
                });
            segmentNumber++;
        };

        mediaRecorder.start(3000);
    })
    .catch(error => {
        console.error('Error accessing camera:', error);
    });

});

I am left with only the first segment playable, as is expected.

How ever when the recording stops, i'd like to merge all those segments recorded using ffmpeg (or any other) with the help of my nodeJs server.

I am having difficulty understand the parsing of mp4 files.

if I try the command:

ffmpeg -i segment1.mp4 -i segment2.mp4 -i segment3.mp4  out.mp4

I get the following error:

    ffmpeg version N-110223-gb18a9c2971-20230410 Copyright (c) 2000-2023 the FFmpeg developers
  built with gcc 12.2.0 (crosstool-NG 1.25.0.152_89671bf)
  configuration: --prefix=/ffbuild/prefix --pkg-config-flags=--static --pkg-config=pkg-config --cross-prefix=x86_64-w64-mingw32- --arch=x86_64 --target-os=mingw32 --enable-gpl --enable-version3 --disable-debug --disable-w32threads --enable-pthreads --enable-iconv --enable-libxml2 --enable-zlib --enable-libfreetype --enable-libfribidi --enable-gmp --enable-lzma --enable-fontconfig --enable-libvorbis --enable-opencl --disable-libpulse --enable-libvmaf --disable-libxcb --disable-xlib --enable-amf --enable-libaom --enable-libaribb24 --enable-avisynth --enable-chromaprint --enable-libdav1d --enable-libdavs2 --disable-libfdk-aac --enable-ffnvcodec --enable-cuda-llvm --enable-frei0r --enable-libgme --enable-libkvazaar --enable-libass --enable-libbluray --enable-libjxl --enable-libmp3lame --enable-libopus --enable-librist --enable-libssh --enable-libtheora --enable-libvpx --enable-libwebp --enable-lv2 --disable-libmfx --enable-libvpl --enable-openal --enable-libopencore-amrnb --enable-libopencore-amrwb --enable-libopenh264 --enable-libopenjpeg --enable-libopenmpt --enable-librav1e --enable-librubberband --enable-schannel --enable-sdl2 --enable-libsoxr --enable-libsrt --enable-libsvtav1 --enable-libtwolame --enable-libuavs3d --disable-libdrm --disable-vaapi --enable-libvidstab --enable-vulkan --enable-libshaderc --enable-libplacebo --enable-libx264 --enable-libx265 --enable-libxavs2 --enable-libxvid --enable-libzimg --enable-libzvbi --extra-cflags=-DLIBTWOLAME_STATIC --extra-cxxflags= --extra-ldflags=-pthread --extra-ldexeflags= --extra-libs=-lgomp --extra-version=20230410
  libavutil      58.  6.100 / 58.  6.100
  libavcodec     60.  9.100 / 60.  9.100
  libavformat    60.  4.101 / 60.  4.101
  libavdevice    60.  2.100 / 60.  2.100
  libavfilter     9.  5.100 /  9.  5.100
  libswscale      7.  2.100 /  7.  2.100
  libswresample   4. 11.100 /  4. 11.100
  libpostproc    57.  2.100 / 57.  2.100
Input #0, matroska,webm, from 'segment1.mp4':
  Metadata:
    encoder         : Chrome
  Duration: N/A, start: 0.000000, bitrate: N/A
  Stream #0:0(eng): Video: h264 (Constrained Baseline), yuv420p(progressive), 1280x720 [SAR 1:1 DAR 16:9], 30.30 fps, 30 tbr, 1k tbn (default)
[mov,mp4,m4a,3gp,3g2,mj2 @ 000001d93cf25fc0] Format mov,mp4,m4a,3gp,3g2,mj2 detected only with low score of 1, misdetection possible!
[mov,mp4,m4a,3gp,3g2,mj2 @ 000001d93cf25fc0] moov atom not found
segment2.mp4: Invalid data found when processing input

any help or inputs are appreciated. THanks!