How to specify content-type of excel file inside form data object, JS, Vue?

Question

My method for creating FormData object

function createFormData (file, payload) {
  let formData = new window.FormData()
  formData.append('Excel', file)
  formData.append('SomeOtherKey', JSON.stringify(payload))
  return formData
}

My method for sending data to server

function sendDataToServer (payload) {
  axios.post('/some-url', payload)
}

And in request body it set as application/octet-stream, but i need: application/vnd.openxmlformats-officedocument.spreadsheetml.sheet

Screen with request payload

How can i specify right Content-Type for file?

Does this post contain what you're looking for? https://stackoverflow.com/questions/44617825/passing-headers-with-axios-post-request-reactjs — slee423, Jun 04 '18 at 08:22
Unfortunately no. There are using applicatoin/json type, but in my case multipart/form-data — Andrew Koliaka, Jun 04 '18 at 08:59
Could you not just update the `Content-Type` to `application/vnd.openxmlformats-officedocument.spreadsheetml.sheet` ? — slee423, Jun 04 '18 at 09:03
In `formData` object I can only specify key, file object (which i receive from file input) and full file name. Browser sets `Content-Type` automatically relying on file extension — Andrew Koliaka, Jun 04 '18 at 10:22
Found answer here: https://stackoverflow.com/questions/1201945/how-is-mime-type-of-an-uploaded-file-determined-by-browser — Andrew Koliaka, Jun 04 '18 at 15:36

score 0 · Answer 1 · answered Jun 16 '22 at 21:57

As far as I know it is not possible to set the content type on the formData object. Maybe you can try specifying the content-type in the axios request instead of the fromData object. You can do it by adding a third param to axios.post() function. It is the config param. Something like this:

const contentTypeIDesireToSet= "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet";

function sendDataToServer (payload) {
  const config= {
         headers:{ 
              "content-type": contentTypeIDesireToSet
         }
  }
  axios.post('/some-url', payload, config);
}

How to specify content-type of excel file inside form data object, JS, Vue?

1 Answers1