MiyRon
MiyRon

Reputation: 436

How convert Express.Multer.File to Blob data?

I have a NestJs project in my controller I accept an Express.Multer.File but I need to send it to another server. How can I convert it to Blob for passing to FormData?

#action in my controller

    @Post('/upload')
    @UseInterceptors(FileInterceptor('avatar'))
    async uploadUserProfileAvatar(@UploadedFile() file: Express.Multer.File){
        
        console.log(file)
        let blob = new Blob(file.mimetype)
        let formData = new FormData()
        //can't set because file is not Blob
        formData.append('file',file)


        let request$ = this.httpService.post('http://test_server/file',formData,{headers:{
            'Content-Type':'multipart/form-data'
        }}).pipe(
            map(response => response.data)
        )

        request$.subscribe( response => {
            console.log(response)
            return response
        })
    }

I will be grateful for every answer!

EDIT:

Thanks again for your help! As a result, I managed to successfully send the code in this way:

    @Post('/upload')
    @UseInterceptors(FileInterceptor('avatar'))
    async uploadUserProfileAvatar(@UploadedFile() file: Express.Multer.File){

        const FormData = require('form-data');
        const formData = new FormData();
        formData.append('file', Buffer.from(file.buffer) , file.originalname);


        let request$ = this.httpService.post('http://nginx_files/file',formData,{headers:formData.getHeaders()}).pipe(
                map(response => response.data)
            )

        request$.subscribe( response => {
            console.log(response)
            return response
        })
    }

Upvotes: 6

Views: 7688

Answers (3)

wlukla
wlukla

Reputation: 83

Encountered same issue, but initial answer didn't work for me, had to add Content-Length header and contentType, so code looks something like this:

import * as FormData from 'form-data';

// ...

    processFile(file: Express.Multer.File) {
        const formData = new FormData();

        formData.append('file', Buffer.from(file.buffer), {
            filename: file.originalname,
            contentType: file.mimetype,
        });

        return this.httpService
            .post('http://test_server/file', formData, {
                headers: {
                    ...formData.getHeaders(),
                    'Content-Length': `${formData.getLengthSync()}`,
                },
            })
            .pipe(map((response) => response.data));
    }

Based on this comment

Upvotes: 1

Enam Solaimani
Enam Solaimani

Reputation: 41

@MiyRon

You get the Error "TypeError: source.on is not a function", because formData accepts only three types of elements. String, Buffer and Stream.

So you can fix it with:

formData.append('file', JSON.stringify(fileContent), 'file_name.ext');

Upvotes: 1

Anatoly
Anatoly

Reputation: 22758

Use formdata package like this:

  const FormData = require('form-data');

  const formData = new FormData();
  formData.append('file', fileContent, 'file_name.ext');

  let request$ = this.httpService.post('http://test_server/file',
    formData,
    { headers: formData.getHeaders() }
  ).pipe(
            map(response => response.data)
        )

Upvotes: 3

Related Questions