Static GitHub Issues

[3321] Access to plugins inside asyncData on the server side

prev: how to custom 500 error page ?
next: nuxt is not true ssr?

Hello,

My issue is very similar to #1697, but I'm not able to make it work using proposed solution. My plugin is simple axios proxy:

import axios from "axios/index";

let instance = axios.create({
  baseURL: process.env.API_URL,
});

function getHeader(token) {
  return {
    'Authorization': 'Bearer ' + token
  };
}

export default ({ store }, inject ) => {
  inject('apiClient', {
    post: function (endpoint, data) {
      let token = store.state.token || '';
      return instance.post(endpoint, data, { headers: getHeader(token) });
    },

    get: function (endpoint) {
      let token = store.state.token || '';
      return instance.get(endpoint, { headers: getHeader(token) });
    }
  });
}

and I have following lines in my page component:

asyncData ({ app }) {
      console.log(app);
      return app.$apiClient.get('/some-url')
          .then(response => {
            this.result = response.data;
          })
    },

Everything works well when request is done on the client side, but when I'm refreashing page it's telling me Cannot read property 'get' of undefined.

<!--cmty--><!--cmty_prevent_hook--><div align="right"><sub><em>This question is available on <a href="https://nuxtjs.cmty.io">Nuxt.js</a> community (<a href="https://nuxtjs.cmty.io/nuxt/nuxt.js/issues/c7052">#c7052</a>)</em></sub></div>