9

Estou configurando as rotas da minha aplicação em Vue.js, inicialmente esta tudo OK, após fazer o login o usuário é redirecionado para o dashboard, agora minha dúvida é como posso evitar que o usuário acesse a rota "/login" (de novo) depois que ele já fez o login e redirecioná-lo de volta à rota anterior? (que ele estava antes de digitar na barra de endereço "/login")

Lendo a documentação do , eu sei que posso utilizar das navigation guards, e usando a global router.beforeEach, que possui três parâmetros: to, from e next, sei que posso manipular esse comportamento usando o from para retornar o usuário para a rota anterior caso ele acesse o "/login" enquanto logado, mas ainda não consegui fazer com que ele fosse redirecionado.

eis meu exemplo de código: router/beforeEach.js

import { checkUserToken } from 'src/utils/storageData'

const isAuthRoute = route => route.path.indexOf('/login') !== -1

const isLogged = () => !checkUserToken()

const needAuth = auth => auth === true

const beforeEach = (to, from, next) => {
  const auth = to.meta.requiresAuth

  // verifica se a rota requer autenticação
  if (needAuth(auth)) {
    // verifica se o usuário já está autenticado
    if (!isAuthRoute(to) && !isLogged()) {
      next('/login')
    } else {
      if (isLogged() && to.path === '/login') {
        from()
      }
      next()
    }
  } else {
    next()
  }
}

export default beforeEach

router/index.js:

import Vue from 'vue'

import VueRouter from 'vue-router'

import {routes} from './routes'

import beforeEach from './beforeEach'

Vue.use(VueRouter)

const router = Vue.router = new VueRouter({
  linkActiveClass: 'active',
  saveScrollPosition: true,
  mode: 'history',
  base: __dirname,
  routes
})

// pega as configurações do import acima
router.beforeEach(beforeEach)

export default router
2
  • Não mexi muito com o Router ainda, mas pelo que parece está tudo OK, tenta dar um log no isLogged() e to.path pra ver se está chegando nessa parte do código e se os valores estão batendo pra ver se consegue achar algo.
    – Pliavi
    Commented 17/02/2017 às 19:28
  • Tem certeza que from é uma função? Acho que você tem que usar next(from) em vez de from()
    – bfavaretto
    Commented 4/10/2017 às 20:22

2 Respostas 2

1

Na rota '/login' pode ser definido o beforeCreate chamando um metodo goback(), veja https://v2.vuejs.org/v2/api/#beforeCreate

beforeCreate () {
    if (isLogged()) {
      this.goBack()
    }
},
methods: {
    goBack () {
      window.history.length > 1
        ? this.$router.go(-1)
        : this.$router.push('/')
    }
  }
0

bem, uma solução que usei é o seguinte, fiz uma verificação para ver se o usuário está logado e se a rota é "/login", então eu dei um next('/') para página home. e esse if fica fora do primeiro if.

if (isLogged() && to.path === '/login') {
    next('/')
 }
1

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .