Content-Type header removed on a POST with no content.

Summary

We have a bit of an edge case but I believe that it is a bug. We have a POST with an empty payload. When the post is executed the Content-Type header is removed and is causing a CORS issue.

Context

Let me explain what does work. Outside of a browser, our API does not care if you send or omit the Content-Type header as there is no payload to inspect. Within a browser, it appears that you must pass the content-type header to ensure that CORS is done correctly.

We create our client with the following code

const webserviceClient = axios.create({
  baseURL: REACT_APP_WS_ENDPOINT,
  headers: {
    'Content-Type': 'application/json;charset=utf-8',
  },
})

But when we execute a post without body content (data) the axios client appears to remove that header and we get a 403 back from the server and a cors error.

Even using fetch within the browser I can mimic this issue by removing the content-type header.

Here is the code that fails.

export const testDeliveryPreferences = () => {
  return webserviceClient.post(`/v1/user/delivery-preferences/ftp-test`)
}

This also fails

export const testDeliveryPreferences = () => {
  return webserviceClient.post(`/v1/user/delivery-preferences/ftp-test`, undefined)
}

And these two both work

export const testDeliveryPreferences = () => {
  return webserviceClient.post(`/v1/user/delivery-preferences/ftp-test`, null)
}

export const testDeliveryPreferences = () => {
  return webserviceClient.post(`/v1/user/delivery-preferences/ftp-test`, {})
}

[maxrahder]

I have this same issue. My backend is some goofy Domino service I can’t control. I have to send form data and set the content header to what Domino expects, yet Axios seems to think it knows better and overwrites my setting. This should be up to the Axios user, not Axios – there are weird non-standard backends out there, and I should be allowed to comply with them, and not with how Axios wishes they were implemented.

[nGoline]

~Does anyone have a workaround for this while we wait for the fix?~

I was able to send the request without the Content-Type header by using this code:

const response = await axios.post(
  url,
  null,
  {
    headers: { ... },
    transformRequest: (data, headers) => {
      delete headers.post['Content-Type'];
    },
  },
);

I was trying to call an API and since I’m not sending any data they’re not expecting Content-Type to be on the header and the call fails.