Vue Axios внутри перехватчика - PullRequest
Новая
       6

Vue Axios внутри перехватчика

0 голосов
/ 06 мая 2018

Цель: сначала, если токен удерживает запросы и получает настройки из API.

Если я делаю так: 

import axios from 'axios'
import store from './store'

const instance = axios.create({
  baseURL: window.location.origin + '/api',
  timeout: 10000,
  params: {}
});

instance.interceptors.request.use(async config => {
  const token = localStorage.getItem('token') || sessionStorage.getItem('token');
  token
    ? config.headers.Authorization = 'Bearer ' + token
    : store.dispatch('setUserToDefault');
  if (!store.state.synced && token)
    await instance
      .post('/user/sync')
      .then(response => {
        store.dispatch('setSettings', response.data.settings);
        store.dispatch('setSynced', true);
      });
  return config;
}, error => Promise.reject(error));

export default instance

Это не работа. Но это решение с другим экземпляром работает: 

import axios from 'axios'
import store from './store'

const instance = axios.create({
  baseURL: window.location.origin + '/api',
  timeout: 10000,
  params: {}
});

if (!store.state.synced)
  axios.interceptors.request.use(config => {
    const token = localStorage.getItem('token') || sessionStorage.getItem('token');
    token
      ? config.headers.Authorization = 'Bearer ' + token
      : store.dispatch('setUserToDefault');
    return config;
  }, error => Promise.reject(error));

instance.interceptors.request.use(async config => {
  const token = localStorage.getItem('token') || sessionStorage.getItem('token');
  token
    ? config.headers.Authorization = 'Bearer ' + token
    : store.dispatch('setUserToDefault');
  if (!store.state.synced && token)
    await axios
      .post(window.location.origin + '/api/user/sync')
      .then(response => {
        store.dispatch('setSettings', response.data.settings);
        store.dispatch('setSynced', true);
      });
  return config;
}, error => Promise.reject(error));

export default instance

На мой взгляд, это решение не выглядит чистым. Есть идеи / предложения?

p.s. Далее в модулях этот экземпляр используется для выполнения запросов и нет, я не использую vue-axios

...