How to clone an axios instance

Question

I have a global axios instance which I use across my application. I want to update headers locally for a particular request. But the headers update is updating the global defaults. I wanted to understand the best way of doing this. Currently I am hacking my way into resetting the headers. Also toyed around with the idea of deep cloning the global axios instance. It just feels like an important feature to have, but couldn't find anything the docs, except for a github issues talking about sub-instances. (https://github.com/axios/axios/issues/1170)

EDIT: sorry for not providing code. This is my setup to give an idea: Following is my global axiosClient(in file apiClient.js), with some interceptors added(not shown in code).

const axiosClient = axios.create({
baseURL,
headers: {
Authorization: ,
'Content-Type': 'application/json',
.
 }
});

In my modules, I import the same client to make api requests as such:

import axiosClient from '../apiClient';

export function someRequest({ file }) {
  let formData = new FormData();
  formData.append('file', file);
  const initHeader = axiosClient.defaults.headers['Content-Type'];
  axiosClient.defaults.headers['Content-Type'] = 'multipart/form-data'; // I want to make this change only for the local instance
  const request = axiosClient.post('parse-rebalance-data', formData);
  axiosClient.defaults.headers['Content-Type'] = initHeader; //I have to reset the changes I made to the axiosClient
  return request;
}

Now my question again is,(1) do I need to do it in this hacky way, or(2) should I look into deep cloning a local copy, or(3) is there a documented way to doing it which I am missing.

user_8376184 · Answer

All that Axios instances do, is set default values for the configuration. You can, however pass any other configuration to each call by using the config parameter, as you would with the global Axios:

import axiosClient from '../apiClient';

export function someRequest({ file }) {
  let formData = new FormData();
  formData.append('file', file);
  return axiosClient.post('parse-rebalance-data', formData, {headers: {'Content-Type': 'multipart/form-data'}});
}

The headers specified in the config argument are merged with those in the defaults.

user_1554732 · Answer

You can do it like this:

const instance = axios.create({
  baseURL: 'https://some-domain.com/api/',
  timeout: 1000,
  headers: {'X-Custom-Header': 'foobar'}
});

How to clone an axios instance

2 Answers