<p dir="auto"><strong>Is your feature request related to a problem? Please describe.</strong><br>
When create Axios instance, there is no way to reuse the global interceptors.<br>
The issue has been discussed in the past <a href="https://github.com/axios/axios/issues/993" data-hovercard-type="issue" data-hovercard-url="/axios/axios/issues/993/hovercard">(#993)</a>, but it is no longer in progress. So I create this issue.</p>
<div class="highlight highlight-source-js notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="test(&quot;instance not have global interceptors&quot;, () =&gt; {
  axios.interceptors.response.use(response =&gt; response, error =&gt; Promise.reject(error));
  const instance = axios.create();
	// axios.interceptors.response.handlers =&gt; 1
	// instance.interceptors.response.handlers =&gt; 0
  expect(instance.interceptors.response.handlers.length).toBe(axios.interceptors.response.handlers.length); // Fail!
});"><pre class="notranslate"><span class="pl-en">test</span><span class="pl-kos">(</span><span class="pl-s">"instance not have global interceptors"</span><span class="pl-kos">,</span> <span class="pl-kos">(</span><span class="pl-kos">)</span> <span class="pl-c1">=&gt;</span> <span class="pl-kos">{</span>
  <span class="pl-s1">axios</span><span class="pl-kos">.</span><span class="pl-c1">interceptors</span><span class="pl-kos">.</span><span class="pl-c1">response</span><span class="pl-kos">.</span><span class="pl-en">use</span><span class="pl-kos">(</span><span class="pl-s1">response</span> <span class="pl-c1">=&gt;</span> <span class="pl-s1">response</span><span class="pl-kos">,</span> <span class="pl-s1">error</span> <span class="pl-c1">=&gt;</span> <span class="pl-v">Promise</span><span class="pl-kos">.</span><span class="pl-en">reject</span><span class="pl-kos">(</span><span class="pl-s1">error</span><span class="pl-kos">)</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
  <span class="pl-k">const</span> <span class="pl-s1">instance</span> <span class="pl-c1">=</span> <span class="pl-s1">axios</span><span class="pl-kos">.</span><span class="pl-en">create</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
	<span class="pl-c">// axios.interceptors.response.handlers =&gt; 1</span>
	<span class="pl-c">// instance.interceptors.response.handlers =&gt; 0</span>
  <span class="pl-en">expect</span><span class="pl-kos">(</span><span class="pl-s1">instance</span><span class="pl-kos">.</span><span class="pl-c1">interceptors</span><span class="pl-kos">.</span><span class="pl-c1">response</span><span class="pl-kos">.</span><span class="pl-c1">handlers</span><span class="pl-kos">.</span><span class="pl-c1">length</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">toBe</span><span class="pl-kos">(</span><span class="pl-s1">axios</span><span class="pl-kos">.</span><span class="pl-c1">interceptors</span><span class="pl-kos">.</span><span class="pl-c1">response</span><span class="pl-kos">.</span><span class="pl-c1">handlers</span><span class="pl-kos">.</span><span class="pl-c1">length</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// Fail!</span>
<span class="pl-kos">}</span><span class="pl-kos">)</span><span class="pl-kos">;</span></pre></div>
<details>
 <summary>Reproduction</summary>
 ```shell
 $ git clone https://github.com/genie-youn/axios-inherited-interceptors.git
 $ cd axios-inherited-interceptors
 $ npm i
 $ npm run test
 ```
</details>
<p dir="auto"><strong>Describe the solution you'd like</strong><br>
Add new property <code class="notranslate">withGlobalInterceptors</code> in <code class="notranslate">AxiosRequestConfig</code></p>
<div class="highlight highlight-source-js notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="test(&quot;instance with `withGlobalInterceptors` options should have global interceptors &quot;, () =&gt; {
  axios.interceptors.response.use(response =&gt; response, error =&gt; Promise.reject(error));
  const instance = axios.create({withGlobalInterceptors: true});
	// axios.interceptors.response.handlers =&gt; 1
	// instance.interceptors.response.handlers =&gt; 1
  expect(instance.interceptors.response.handlers.length).toBe(axios.interceptors.response.handlers.length); // success
});"><pre class="notranslate"><span class="pl-en">test</span><span class="pl-kos">(</span><span class="pl-s">"instance with `withGlobalInterceptors` options should have global interceptors "</span><span class="pl-kos">,</span> <span class="pl-kos">(</span><span class="pl-kos">)</span> <span class="pl-c1">=&gt;</span> <span class="pl-kos">{</span>
  <span class="pl-s1">axios</span><span class="pl-kos">.</span><span class="pl-c1">interceptors</span><span class="pl-kos">.</span><span class="pl-c1">response</span><span class="pl-kos">.</span><span class="pl-en">use</span><span class="pl-kos">(</span><span class="pl-s1">response</span> <span class="pl-c1">=&gt;</span> <span class="pl-s1">response</span><span class="pl-kos">,</span> <span class="pl-s1">error</span> <span class="pl-c1">=&gt;</span> <span class="pl-v">Promise</span><span class="pl-kos">.</span><span class="pl-en">reject</span><span class="pl-kos">(</span><span class="pl-s1">error</span><span class="pl-kos">)</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
  <span class="pl-k">const</span> <span class="pl-s1">instance</span> <span class="pl-c1">=</span> <span class="pl-s1">axios</span><span class="pl-kos">.</span><span class="pl-en">create</span><span class="pl-kos">(</span><span class="pl-kos">{</span><span class="pl-c1">withGlobalInterceptors</span>: <span class="pl-c1">true</span><span class="pl-kos">}</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
	<span class="pl-c">// axios.interceptors.response.handlers =&gt; 1</span>
	<span class="pl-c">// instance.interceptors.response.handlers =&gt; 1</span>
  <span class="pl-en">expect</span><span class="pl-kos">(</span><span class="pl-s1">instance</span><span class="pl-kos">.</span><span class="pl-c1">interceptors</span><span class="pl-kos">.</span><span class="pl-c1">response</span><span class="pl-kos">.</span><span class="pl-c1">handlers</span><span class="pl-kos">.</span><span class="pl-c1">length</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">toBe</span><span class="pl-kos">(</span><span class="pl-s1">axios</span><span class="pl-kos">.</span><span class="pl-c1">interceptors</span><span class="pl-kos">.</span><span class="pl-c1">response</span><span class="pl-kos">.</span><span class="pl-c1">handlers</span><span class="pl-kos">.</span><span class="pl-c1">length</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// success</span>
<span class="pl-kos">}</span><span class="pl-kos">)</span><span class="pl-kos">;</span></pre></div>
<h4 dir="auto">Are global interceptors inherited by instances in run time or copied when created?</h4>
<p dir="auto">IMHO, Global interceptors should be copied when instance are created.</p>
<p dir="auto">Once an instance is created, it should not be affected even if the global interceptors are changed. I think it would be easier to maintain an instance in an independent state from global.<br>
Similarly, it should not affect the global even if the interceptor of the instances are changed.</p>
<p dir="auto"><strong>Describe alternatives you've considered</strong><br>
In the thread, It was also discussed about the <code class="notranslate">extend</code>. <a class="user-mention notranslate" data-hovercard-type="user" data-hovercard-url="/users/bierik/hovercard" data-octo-click="hovercard-link-click" data-octo-dimensions="link_type:self" href="https://github.com/bierik">@bierik</a></p>
<div class="highlight highlight-source-js notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="import axios from 'axios';

export const api = axios.create({
  baseURL: process.env.API_ROOT,
});

api.interceptors.request.use((request) =&gt; {
  request.headers.Authorization = `Bearer mytoken`;
  return request;
});

// Here the pdfInstance extends the api instance so the pdfInstance has also access to the request interceptor but is also able to override the baseURL and adding additional header such as Accept
export const pdfInstance = api.extend({
  baseURL: '/file',
  responseType: 'arraybuffer',
  headers: {
    Accept: 'application/pdf',
  },
});"><pre class="notranslate"><span class="pl-k">import</span> <span class="pl-s1">axios</span> <span class="pl-k">from</span> <span class="pl-s">'axios'</span><span class="pl-kos">;</span>

<span class="pl-k">export</span> <span class="pl-k">const</span> <span class="pl-s1">api</span> <span class="pl-c1">=</span> <span class="pl-s1">axios</span><span class="pl-kos">.</span><span class="pl-en">create</span><span class="pl-kos">(</span><span class="pl-kos">{</span>
  <span class="pl-c1">baseURL</span>: <span class="pl-s1">process</span><span class="pl-kos">.</span><span class="pl-c1">env</span><span class="pl-kos">.</span><span class="pl-c1">API_ROOT</span><span class="pl-kos">,</span>
<span class="pl-kos">}</span><span class="pl-kos">)</span><span class="pl-kos">;</span>

<span class="pl-s1">api</span><span class="pl-kos">.</span><span class="pl-c1">interceptors</span><span class="pl-kos">.</span><span class="pl-c1">request</span><span class="pl-kos">.</span><span class="pl-en">use</span><span class="pl-kos">(</span><span class="pl-kos">(</span><span class="pl-s1">request</span><span class="pl-kos">)</span> <span class="pl-c1">=&gt;</span> <span class="pl-kos">{</span>
  <span class="pl-s1">request</span><span class="pl-kos">.</span><span class="pl-c1">headers</span><span class="pl-kos">.</span><span class="pl-c1">Authorization</span> <span class="pl-c1">=</span> <span class="pl-s">`Bearer mytoken`</span><span class="pl-kos">;</span>
  <span class="pl-k">return</span> <span class="pl-s1">request</span><span class="pl-kos">;</span>
<span class="pl-kos">}</span><span class="pl-kos">)</span><span class="pl-kos">;</span>

<span class="pl-c">// Here the pdfInstance extends the api instance so the pdfInstance has also access to the request interceptor but is also able to override the baseURL and adding additional header such as Accept</span>
<span class="pl-k">export</span> <span class="pl-k">const</span> <span class="pl-s1">pdfInstance</span> <span class="pl-c1">=</span> <span class="pl-s1">api</span><span class="pl-kos">.</span><span class="pl-en">extend</span><span class="pl-kos">(</span><span class="pl-kos">{</span>
  <span class="pl-c1">baseURL</span>: <span class="pl-s">'/file'</span><span class="pl-kos">,</span>
  <span class="pl-c1">responseType</span>: <span class="pl-s">'arraybuffer'</span><span class="pl-kos">,</span>
  <span class="pl-c1">headers</span>: <span class="pl-kos">{</span>
    <span class="pl-c1">Accept</span>: <span class="pl-s">'application/pdf'</span><span class="pl-kos">,</span>
  <span class="pl-kos">}</span><span class="pl-kos">,</span>
<span class="pl-kos">}</span><span class="pl-kos">)</span><span class="pl-kos">;</span></pre></div>
<p dir="auto"><strong>Personally</strong>, I prefer the <code class="notranslate">AxiosRequestConfig</code> way because it is simpler. <g-emoji class="g-emoji" alias="smile" fallback-src="https://github.githubassets.com/images/icons/emoji/unicode/1f604.png">😄</g-emoji></p>
<p dir="auto"><strong>Additional context</strong><br>
It’s a very personal idea. I will appreciate any feedback.</p>
<p dir="auto">I hope this feature will come into real world, and if this idea looks good, I want to implement this feature. <g-emoji class="g-emoji" alias="laughing" fallback-src="https://github.githubassets.com/images/icons/emoji/unicode/1f606.png">😆</g-emoji></p>
<p dir="auto">#### Summary</p>
<p dir="auto">I searched through all the issues and double checked the ones referenced in <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="218798071" data-permission-text="Title is private" data-url="https://github.com/axios/axios/issues/812" data-hovercard-type="issue" data-hovercard-url="/axios/axios/issues/812/hovercard" href="https://github.com/axios/axios/issues/812">#812</a> but my problem seems to be different.</p>
<p dir="auto">My problem is that creating an instance does not copy over or use the interceptors added to the global Axios.</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="import Axios from &quot;axios&quot;;

Axios.interceptors.request.use((config) =&gt; {
  console.log(&quot;Global Interceptor&quot;)
  return config;
});

const axiosInstance = () =&gt; {
  let instance = Axios.create();
  console.log(Axios.interceptors.request); // Has 1
  console.log(instance.interceptors.request); // Has 0
  return instance;
}

axiosInstance().post(&quot;/test&quot;, { testing: &quot;data&quot; }); // Doesn't output &quot;Global Interceptor&quot;
Axios.post(&quot;/test&quot;, { testing: &quot;data&quot; }); // Outputs &quot;Global Interceptor&quot;"><pre class="notranslate"><code class="notranslate">import Axios from "axios";

Axios.interceptors.request.use((config) =&gt; {
  console.log("Global Interceptor")
  return config;
});

const axiosInstance = () =&gt; {
  let instance = Axios.create();
  console.log(Axios.interceptors.request); // Has 1
  console.log(instance.interceptors.request); // Has 0
  return instance;
}

axiosInstance().post("/test", { testing: "data" }); // Doesn't output "Global Interceptor"
Axios.post("/test", { testing: "data" }); // Outputs "Global Interceptor"
</code></pre></div>
<p dir="auto">#### Context</p>
<ul dir="auto">
<li>Axios version: 0.16.2</li>
<li>Environment: Webpack 2.6.1, Chrome Canary 61.0.3147.0, Mac OS X</li>
</ul>