CODEWITHSUNDEEP
axios
Big boy
Big boy

Reputation: 1741

axios keeps removing question mark for query string

Here's my axios config:

const axiosApi = axios.create({
  baseURL: process.env.NEXT_PUBLIC_API_URL
})

axiosApi.interceptors.response.use(
  response =>
    response
  ,
  error => {
    if (error.response.status === 404) {
      throw new Error(`404\nService does not exist\n${error.request.path}`)
    }
  }
)

export async function get(url) {
  console.log(url)
  return await
    axiosApi.get(url, {
      crossDomain: true
    }).then(response => {
      return response?.data
    })
}

The problem is that when I try to get /path?key=value, I get the /pathkey=value does not exist error.

While console.log(url) shows me the true URL with the question mark and query string, the response interceptor strips the question mark out and that causes 404.

Any idea why this happens?

Upvotes: 5

Views: 1135

Answers (3)

Dawid Kisielewski
Dawid Kisielewski

Reputation: 829

This is an Axios bug in v1.0.0

Upvotes: 6

sfalpha
sfalpha

Reputation: 21

Try limit the version in dependency.

"dependencies": { "axios": "~0.27.2", },

may help.

Personally I don't even get why Axios developer decide to do this.

Basically according to HTTP Protocol both path and query parameters is considered URI.

Axios.get() should accept everything that is considered URI to conform with HTTP specifications.

And project which let user input its URL for fetch the data will just broken out of the box.

Upvotes: 2

huan feng
huan feng

Reputation: 8623

You should pass the query params like below:

axios.get('/path', { params: { key: value} });

Upvotes: 2

Related Questions