HeavyCookie

Utiliser Axios.get avec des tableaux de paramètres complexes

Axios me simplifie généralement la vie, mais on est parfois amené à utiliser des endpoints REST nécessitant d'utiliser des objets imbriqués. Imaginons avoir l'objet suivant :

type Request = {
  query: string
  coordinates: {
    latitude: number
    longitude: number
  }
}

Sans configuration, Axios va correctement encoder le contenu de query, mais va m'encoder mon champ coordinates en base64.

Pour éviter ce problème, il suffit d'ajouter la librairie qs à coup de

yarn install qs

Puis de créer un fichier de configuration comme celui-ci :

import Axios from 'axios'
import qs from 'qs'
 
Axios.interceptors.request.use(config => {
  window.console.log(config)
 
  config.paramsSerializer = params =>
    return qs.stringify(params, {
      arrayFormat: 'brackets',
      encode: false,
    })
 
 
  return config
})

Il ne reste plus qu'à importer cette configuration dans votre projet et le tour est joué !