How to prevent Axios from encoding my request parameters?

Question

I'm trying to pass in an API key through the URL parameters in my GET request.

However, I notice that Axios encodes the characters in my API key when sending the request. This causes the API to reject my request as it couldn't recognise my key.

How can I prevent Axios from encoding my GET parameters?

Answer 1

You can use a custom param serializer as follows:

axios.get('https://foobar.com/api', {
  paramsSerializer: function(params) {
    var result = '';
    // Build the query string 
    return result;
  }
});

paramsSerializer can be set at the instance level:

var instance = axios.create({ paramsSerializer: function(params) { /* ... */ } })

or at the global level:

axios.defaults.paramsSerializer = function(params) { /* ... */ };

Another option is to directly add the api key to the URL:

axios.get('https://foobar.com/api?api_key=' + key);

You can add additional parameters using the `params' config option:

axios.get('https://foobar.com/api?api_key=' + key, {
  params: {
    foo: 'bar'
  }
});

Answer 2

In case you are using qs library (or similar encoding lib) you can also do

import qs from 'qs';

axios.get('https://foobar.com/api', {
    params,
    paramsSerializer: (params) => qs.stringify(params, { encode: false }),
});