Axios requests not working after update from 0.19.0 to 0.21.1

[GersonDias]

Describe the issue

after updating axios from 0.19 to 0.21.1 I figure out that none of my requests are working in Firefox (it's working on chrome and edge). Not sure how to debug that, I can't even see my request in the network tab... reverting back to 0.19.0 make it work.... there is some breaking change between that updates?

Example Code

return axios({
      url,
      method,
      headers,
      baseURL: apiBaseURL,
      params: method === 'GET' ? data : null,
      data: body,
      onUploadProgress: (progressEvent) => {
        if (progressCallback) {
          progressCallback(progressEvent)
        }
      },
      responseType: isFileDownload ? 'blob' : responseType,
    })
      .then((response) => {
        const resp = {
          is_error: response.status < 200 || response.status > 299,
          content: response.data,
        }

        if (isFileDownload) {
          RestUtils.DownloadFile(response)
        }

        return resp
      })
      .catch((error) => {
        if (error.code === 'ECONNABORTED') {
          return Promise.resolve({ is_error: false, content: [] })
        }
        if (!error.response) {
          return Promise.reject(new Error("request didn't receive a response"))
        } else {
          if (error.response.status === 401) {
            appHistory.push('/logout')
            return Promise.reject(/*new Error('Unauthorized')*/)
          }

          if (error.response.status === 403) {
            return Promise.reject({
              error: 'Action not allowed',
              statusCode: '403',
            })
          }

          return Promise.reject(error)
        }
      })

Expected behavior, if applicable

should work on Firefox with Axios 0.21.1

Environment

• Axios Version 0.21.1
• Adapter XHR/HTTP
• Firefox
• 84
• Node.js Version [e.g. 13.0.1]
• OS: [windows 10]
• Additional Library Versions React 17.0.1

Additional context/Screenshots

Add any other context about the problem here. If applicable, add screenshots to help explain.

[maxdhn]

Same issue here, when using responseType: 'blob' with Brave browser. I got the following error : Failed to read the 'responseText' property from 'XMLHttpRequest': The value is only accessible if the object's 'responseType' is '' or 'text' (was 'blob').

[GersonDias]

Same issue here, when using responseType: 'blob' with Brave browser. I got the following error : Failed to read the 'responseText' property from 'XMLHttpRequest': The value is only accessible if the object's 'responseType' is '' or 'text' (was 'blob').

the request that I'm testing is not using responseType: 'blob', but maybe is related... should I change this to a bug not a question?

[jasonsaayman]

Hi,

I think your issue has to do with pull request #3289, you will see we are allowing the browser to settle the content type rather than try to dictate it. Also, there was a change to merge config with #2844, so you would need to check if these changes have any bearing on what you are trying to do above? I would try to debug but you have so much going on in one request it can be any amount of things (configs, blob, response type manipulation).

Also, should you be able to would you mind testing with 0.20 and tell us what that does?

[GersonDias]

I tried with 0.20.0 version and didn't work.

[Crashillo]

Previously, I did my requests like:

const headers = new Headers({
  "Content-type": "application/json"
});

After this update, Firefox throws me invalid header name

I noticed, as a workaround, that setting headers as a plain object works (also it works removing such a common header). So the issue comes up from the Headers interface.

[TravisBumgarner]

We're also experiencing issues with "Network Error", SSL errors, and more errors.

[nntdias]

I'm facing the same issue, PUT and POST requests are not sending the payload.

[BobbiSixkiller]

Same issue here, after npm prompted me with audit fix during rebuilding my frontend docker container I've updated axios. The next time I've built my container my frontend did not send any requests no matter the browser.

[DRD161]

Same issue here unfortunately. Took several hours to realize axios was the culprit. Rolling back to version 0.19 fixed the issue.

[eddiemonge]

Also, the way axios handles error responses is a breaking change. Before it would throw if a non-200 was received. Now it does not throw so the response needs to be examined

[nntdias]

For me, before this update, I could do something like this.

After a few hours debugging this error, I realized that if in the second parameter of the PUT method the value is null, it will not get the data attribute in the options object.

[JSEvgeny]

We got the same issue here. Auth1 header don't work any more...

[GersonDias]

no, even GET methods are not working on Firefox after upgrade to 0.21.1 Em qui., 2 de set. de 2021 às 05:06, Kanat Bektursyn < ***@***.***> escreveu:

…

Does this issue occur only in PUT methods? — You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub <#3526 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AAPG6VRXJDYLSEVHOF6ERMLT74WAJANCNFSM4VVIZD2A> . Triage notifications on the go with GitHub Mobile for iOS <https://apps.apple.com/app/apple-store/id1477376905?ct=notification-email&mt=8&pt=524675> or Android <https://play.google.com/store/apps/details?id=com.github.android&referrer=utm_campaign%3Dnotification-email%26utm_medium%3Demail%26utm_source%3Dgithub>.

[GersonDias]

I finally got what is going on with this issue

https://codesandbox.io/s/determined-moon-c6cy6?file=/src/App.js

the code

  const headers = new Headers()
  axios({
      ...
      headers: headers
  })

works on version "0.19.x" but not on "0.20.x". Changing to const headers = {} do the trick.

I don't know from where that code comes from (headers = new Headers()) - was a blog post? was a documentation somewhere? was just because intelisense? ) but was that "compatibility break" intentional?

[ergonomicus]

But that's what is suggested here: #3526 (comment) on January 7th :-)

[GersonDias]

but others also didn't give attention to @Crashillo comment... it is why I asked if it was intentional or is just my mistake of not properly using the lib... :)

[Crashillo]

So my comment deserves some emojis to make it relevant...

[jasonsaayman]

I have released 0.22.0 please check if that fixes your error, if not please open a new issue :)