file upload using axios in react

Question

I am uploading file in react using axios. when I am doing

alert(values.attachedFile[0]);

but when I am sending values.attachedFile[0] in axios post request enpty thing is going.

  const { result } = await axios.post(app.resourceServerUrl + '/file/upload', {
        data: values.attachedFile[0],
        headers: {
            'Content-Type': 'multipart/form-data',
        },
    });

but as part of request is is going empty.

what mistake I am doing?

Show source code of nest.js controller who manage the route file/upload — Fiodorov Andrei
– Fiodorov Andrei, Commented Feb 15, 2022 at 8:14

Fiodorov Andrei · Accepted Answer · 2022-02-15 08:12:17Z

15

+100

To upload file with axios you need to use FormData:

const formData = new FormData();

// ...

formData.append("data", values.attachedFile[0]);
axios.post(app.resourceServerUrl + '/file/upload', formData, {
    headers: {
      'Content-Type': 'multipart/form-data'
    }
})

answered Feb 15, 2022 at 8:12

Fiodorov Andrei

2,0481 gold badge19 silver badges31 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

file upload using axios in react

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related