(Nuxt) Отправка текущего токена с неправильно работающими заголовками asyncData (условия гонки, я думаю)

Question

У меня проблема с asyncData. После входа пользователя существует токен JWT, и этот токен должен быть включен в заголовки каждого запроса.

Я создал два плагина для обработки этого, и все отлично работает в первом вызове. Но всякий раз, когда я перезагружаю страницу, я замечаю, что заголовки asyncData пусты (401 не авторизован). Я думаю, что мой плагин подключал токен к Ax ios по умолчанию ПОСЛЕ отправки запроса asyncData. Может быть, это состояние гонки между asyncData и плагинами.

PS, когда я изменяю asyncData на created, он отлично работает с небольшой задержкой.

Магазин аутентификации :

export const state = () => ({
  user: {},
  token: '',
  status: ''
})

export const getters = {
  LoggedInUser(state) {
    return state.user
  },
  Token(state) {
    return state.token
  },
  Authenticated (state) {
    return !! state.token
  }
}
export const mutations = {
  authrequest(state) { state.status = 'loading' }, authsuccess(state, token) {
    state.status = 'success'
    state.token = token
  },
  authsuccess2(state, user) { state.user = user }, autherror(state) {
    state.status= 'error'
  },
  auth_logout(state) {
    state.status = ''
    state.token = ''
    state.user = ''
  }
}
export const actions = {
  async login({commit}, data) {
    commit('authrequest') 
    try { const res = await this.$axios.$post('/api/auth/login', data) const token = res.accesstoken
      const user = Object.assign({}, res.user)
      localStorage.setItem('user', JSON.stringify(user))
      localStorage.setItem('token', token)
      this.$axios.defaults.headers.common['Authorization'] = 'Bearer '+ token
      commit('authsuccess', token) commit('authsuccess2', user)
      this.$router.push('/')
    }
    catch (e) {
      console.log(e.message)
      localStorage.removeItem('user')
      localStorage.removeItem('token')
      commit('auth_error')
    }
  }
}

Плагин storeInit.client, в котором я обновляю sh состояния после перезагрузки:

export default ({ store }) => {
  const token = localStorage.getItem('token') || ''
  const user = JSON.parse(localStorage.getItem('user')) || ''
  store.commit('auth/authsuccess', token) store.commit('auth/authsuccess2', user)
  console.log(token)
}

Хранилище Ax ios, где я устанавливаю токен с каждым запросом:

export default ({ $axios, store }) =>{
  const token = store.getters['auth/Token']
  if(token) {
    $axios.onRequest((config) => {
      config.headers.Authorization = 'Bearer '+ token;
    })
   }
   console.log(token)
 }

И, наконец, индексный компонент, где у меня есть asyncData:

<template>
  <ChargeComponenet :balance="balance" :pending="pending"></ChargeComponenet> 
  <InvoiceComponent> </InvoiceComponent> 
  <CustomerComponent></CustomerComponent> 
  <PlanComponent></PlanComponent>
</template>


<script>
     import ChargeComponenet from "../components/ChargeComponenet";
     import CustomerComponent from "../components/CustomerComponent";
     import InvoiceComponent from "../components/InvoiceComponent"; 
     import PlanComponent from "../components/PlanComponent"; 
     export default { 
        components:{ChargeComponenet,CustomerComponent,InvoiceComponent,PlanComponent}, 
        data() { return { balance: '', pending: '' } }, 
        async asyncData({$axios }) {  
          try { 
             const data = await $axios.$get('/api/home/get') 
             return { balance: data.balance, pending: data.pending } } 
          catch (e) { console.log(e) } 
       } 
    } 
</script>