Как сделать задержку при проверке на авторизацию vue.js?

Question

[helixly]

Есть SPA приложение на Vue.js + Laravel. Вся логика авторизации находится непосредственно в Laravel. При использовании Vue-router, возникла необходимость проверять авторизован пользователь или нет. Собственно есть небольшой класс Auth который этим занимается

export default {
	user: {
		authenticated : false
	},
	check: function(context) {
		context.$http.get('/api/v1/user').then((response) => {
                if (response.body.user != null) {
                    this.user.authenticated = true
                }
      }, (response) =>{
      	 сonsole.log(response)
      });
   }
}

В самом компоненте есть метод beforeRouteEnter который срабатывает при переходе на данный url

beforeRouteEnter (to, from, next) {
    next(vm =>{
      Auth.check(vm);
        if (!Auth.user.authenticated) {
          next({path:'/login'});
        }
    })
  }

Функция next, которая собсвенно производит переход на данный url, принимает callback с инстансом Vue.
Затем в самой функции next можно вызвать ее еще раз для перехода на другой url, если что-то пошло не так.
Вообщем-то все работает, только если страница уже загружена браузером. Если попытать сразу зайти на ключевую страницу, то происходит редирект на /login, даже если пользователь авторизован, так как запрос к api еще не успел завершится, а код продолжает выполнятся. Есть идеи как это побороть?

Answer 1

[helixly]

Додумался вообщем. Недооценил я мощь промисов. Кому интересно, надо вернуть промис

check: function(context) {
   return context.$http.get('/api/v1/user').then((response) => {
                if (response.body.user != null) {
                    this.user.authenticated = true
                }
      }, (response) =>{
      	 сonsole.log(response)
      });
   }

Затем

beforeRouteEnter (to, from, next) {
    Auth.check().then( ( ) => {
        if(!Auth.user.authenticated)
           next({ path: '/login' })
        else
           next()
    })
  }