Question

34

file upload using axios in react

rated 0 times [ 36] [ 2] / answers: 1 / hits: 11752 / 2 Years ago, tue, february 8, 2022, 12:00:00

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?

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

jocelynkarsynr

Add To Favorites

Follow

Total Points: 472

Total Questions: 98

Total Answers: 96

Location: Macau

Member since Mon, Nov 16, 2020

4 Years ago

jocelynkarsynr questions

1 Unable to write data (addRow) into Excel file in Nodejs

Sat, Jul 11, 20, 00:00, 4 Years ago

1 How can I export * as namespace in Babel?

Sun, May 10, 20, 00:00, 4 Years ago

1 React Routing to Same Component with Different URL

Sat, Jan 18, 20, 00:00, 4 Years ago

1 How do I persist user authentication using the Firebase refresh token?

Tue, Aug 20, 19, 00:00, 5 Years ago

1 Is it possible to es6 import a commonjs module?

Thu, Mar 14, 19, 00:00, 5 Years ago

View All

answered 2 Years ago arthur · Accepted Answer

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'

    }

})