2 years ago

Vue Router and reloading, how to redirect to the requested page

Posted 2 years ago by Ashraam

Hi everyone,

I've got a problem and I can't solve it, maybe someone here could help me.

When I reload the page (F5) I'm always redirected to /login (except if I've got a token in the store then I'll stay on /)

I'd like to stay on pages that don't require auth after a reload. eg: I'm on /reset, I reload the page and stay on /reset (right now after a reload I'm always redirected to /login)

It's the same if I copy / paste uri in the browser, always redirected to /login

How can I achieve that ?

Do you need something else in my code ?


Here is my vue-router confirguration

import Vue from 'vue'
import VueRouter from 'vue-router'

import store from './store';


import Calendar from './vue/Calendar.vue'
import Login from './vue/Login.vue'
import Register from './vue/Register.vue'
import LostPassword from './vue/LostPassword.vue'

const routes = [
        path: '/',
        name: 'index',
        component: Calendar,
        meta: {
            requiresAuth: true
        path: '/login',
        name: 'login',
        component: Login
        path: '/register',
        name: 'register',
        component: Register
        path: '/reset',
        name: 'reset',
        component: LostPassword

const router = new VueRouter({
    mode: 'history',

router.beforeEach((to, from, next) => {
    if (to.matched.some(m => m.meta.requiresAuth) && store.state.token === null) {
        return next('/login');
    } else {
        return next();

export default router;

Please sign in or create an account to participate in this conversation.