title: How to get data in the axios header to a component in Vue
body: <p>I have an axios <code>apiClient</code> and I'm trying to get the email stored in <code>localStorage</code> into the header.  In my component I tried using</p>
  <pre><code>response.headers['email']
  </code></pre>
  <p>and assigning it to an email variable but I'm getting undefined. I'm getting the email in <code>localStorage</code> but not able to get it in the component. Any help will be greatly appreciated.</p>
  <p>Axios</p>
  <pre class="lang-js prettyprint-override"><code>const apiClient = axios.create({
    baseURL: `${API}`,
    withCredentials: false,
    headers: {
       Accept: &quot;application/json&quot;,
               &quot;Content-Type&quot;: &quot;application/json&quot;
      }
  });
  
  apiClient.interceptors.request.use(function (config) {
    let token = JSON.parse(localStorage.getItem('token'));
    let email = JSON.parse(localStorage.getItem('email'));
    if (token) {
      config.headers.Authorization = `Bearer ${token}`;
      config.headers.email = `${email}`;
    }
    return config;
  }, function (err) {
    return Promise.reject(err);
  });
  </code></pre>
  <p>Here is the method in my component where I need the email data</p>
  <pre class="lang-js prettyprint-override"><code>methods: {
    getOrders(){
      service.getAllOrders()
      .then(response =&gt; {
        this.email = response.headers['email'];
        console.log(&quot;email:&quot;, this.email)
      })
    }
  }
  </code></pre>
  <p><code>getAllOrders()</code> does an axios <code>get</code>.</p>