Ожидание запроса, расположенного в промежуточном программном обеспечении, завершено перед отображением страницы - PullRequest
Новая
       7

Ожидание запроса, расположенного в промежуточном программном обеспечении, завершено перед отображением страницы

1 голос
/ 23 мая 2019

У меня есть проблема здесь.Я использую Vue.js вместе с Nuxt.js.

Я сделал промежуточное ПО для реализации аутентификации.Здесь я использую JSON Web Token.У меня есть accessKey и refreshKey.RefreshKey используется для запроса нового accessKey после истечения срока действия accessKey.Поэтому в промежуточном программном обеспечении я вызываю действие, которое делает запрос к API.Вот мой код:

home / index.vue 

<template>
I'm protected resource
</template>

<script>
export default {
  middleware: 'authentication'
}
</script>

middleware / authentication.js 

import { isEmpty } from 'lodash'
export default async function({ store, redirect, app }) {
  if (isEmpty(refKey)) {
    //logout
  }
  if (isLogin && !isEmpty(accKey)) {
    // store auth data
  } else if (isLogin && isEmpty(accKey)) {
    // call action that make request with axios to the API
    return await store.dispatch('user/requestNewToken')
  } else {
    return redirect('/')
  }
}

Мое действие: 

async requestNewToken({ dispatch, commit }) {
    const refreshReq = await dispatch('refreshToken')
    if (!isUndefined(refreshReq) {
      await dispatch('setupAuthCookies')
      return refreshReq
    }
  },

Но приложение возвращает ошибку.Это связано с тем, что страница обрабатывается до завершения запроса AXIOS.Как предотвратить перенаправление и рендеринг страницы Vue до того, как мой запрос axios (для получения нового accessKey) полностью завершится?Спасибо.

...