Использование Ax ios для повторного запроса после обновления токена JWT в хранилище Vuex

Question

Я пытаюсь использовать Ax ios, чтобы повторить неудачные запросы из-за истечения срока действия JWT

До сих пор у меня был следующий запрос в методе для компонента Vue:

  getAPI2.get("/api/v1/sessions/",{ headers: headers }).then(response => {
          console.log(response);
          this.items = response.data.items;
      });

Используется приведенный ниже перехватчик, когда он обнаруживает ошибку

const getAPI2 = axios.create({
  baseURL: '/'
})


getAPI2.interceptors.response.use(response => response, err => {
  if (err.config && err.response && err.response.status === 401) {
    store.dispatch('refreshToken')
      .then(access => {

        axios.request({
          method: 'get',
          headers: { Authorization: `Bearer ${store.state.accessToken}` },
          url: err.config.url
        }).then(response => {
          console.log('Successfully got data')
          console.log(response)
          return response;
        }).catch(err => {
          console.log('Got the new access token but errored after')
          return Promise.reject(err)
        })
      })
      .catch(err => {
        return Promise.reject(err)
      })
  }
})

Я вижу данные, когда запрос обнаруживает ошибку и проходит через перехватчик, но я думаю, что существует проблема при передаче обратно Ответ на мой компонент

Извинения, если это очевидно, мои javascript знания находятся в зачаточном состоянии

Answer 1

После некоторой игры мне удалось заставить это работать:

const getAPI3 = axios.create({
  baseURL: '/'
})

  getAPI3.interceptors.response.use( (response) => {
    // Return normal response
    return response;
  }, (error) => {
    // Return non auth error
    if (error.response.status !== 401) {
      return new Promise((resolve, reject) => {
        reject(error);
      });
    }

    return store.dispatch('refreshToken')
      .then((token) => {

        // Make new request
        const config = error.config;
        config.headers = { Authorization: `Bearer ${store.state.accessToken}` }

        return new Promise((resolve, reject) => {
          axios.request(config).then(response => {
            resolve(response);
          }).catch((error) => {
            reject(error);
          })
        });

      })
      .catch((error) => {
        Promise.reject(error);
      });
  });