How can we save blob url into (.webm) video in my server with nodejs and multer

Question

I'm recording video using html5 and getting blob code (blob:http://localhost:3000/e359696c-b126-4382-bcc3-eaa1db01f322) I want to upload this video to the server with node.js. How can I do it?

Html Codes:

camera_stream = await navigator.mediaDevices.getUserMedia({ video: true });
video.srcObject = camera_stream;
media_recorder = new MediaRecorder(camera_stream, { mimeType: 'video/webm' });
media_recorder.addEventListener('dataavailable', function(e) {
    blobs_recorded.push(e.data);
});


let video_local = URL.createObjectURL(new Blob(blobs_recorded, { type: 'video/webm' }));
var fd = new FormData();
fd.append('name', 'test.webm');
fd.append('data', video_local);
$.ajax({
    type: 'POST',
    url: '/cam',
    data: fd,
    cache : false,
    contentType : false,
    processData : false
}).done(function(data) {
    console.log('success');
});

Node.js And Multer

router.post('/cam',upload.single("data"),(req,res)=>{
    console.log(req.body);
})

But not working upload and result in multer:

[Object: null prototype] {
  name: 'test.webm',
  data: 'blob:http://localhost:3000/a1ce2f38-2cc1-4216-979b-90e574d11b75'
}

How can I convert this blob url to (.webm)video(mp4) and save in one folder?

Answer 1

You have to upload the blob itself not a blob url.

fd.append('data', new Blob(blobs_recorded, { type: 'video/webm' }));