Страница на маршрут 404 с логином - PullRequest
Новая
       10

Страница на маршрут 404 с логином

0 голосов
/ 13 декабря 2018

Моя проблема в том, что когда я начал использовать router.beforeEach(), он не перейдет на страницу 404, когда я наберу несуществующую ссылку.Он просто заходит на страницу с разметкой defaukt, которую я использую.Я использую router.beforeEach() для проверки, вошел ли пользователь в систему или нет.Чего-то не хватает, или что-то не так?

Это мой router.js

let router = new Router({
mode: 'history',
base: process.env.BASE_URL,
routes: [
    {
        path: '/',
        name: 'login',
        component: () => import('./views/Login.vue'),
        meta: {
            layout: "empty"
        },
    },
    {
        path: '/home',
        name: 'home',
        component: () => import('./views/Home.vue'),
        meta: {
            requiresAuth: true
        }
    },
    {
        path: '/404',
        name: '404',
        component: () => import('./views/404.vue'),
        meta: {
            layout: "empty"
        },
    },
    {
        path: '*',
        redirect: '/404'
    },
    {
        path: '/*',
        redirect: '/404'
    }
]
});

router.beforeEach((to, from, next) => {
    const isLoggedIn = JSON.parse(localStorage.getItem('UH'));
    console.log(isLoggedIn);
    const requiresAuth = to.matched.some(record => record.meta.requiresAuth);
    if (isLoggedIn === null){
        if (requiresAuth && !isLoggedIn.user) {
            next('/');
        } else {
            next();
        }
    } else {
        next();
    }
});

1 Ответ

0 голосов
/ 13 декабря 2018

Если я хорошо понимаю вашу проблему, когда пользователь вводит что-то неправильное в URL и не вошел в систему , этот пользователь перенаправляется на '/' вместо 404.

Этопотому что ловушка beforeEach используется перед перенаправлением вашего маршрута {path: '*', redirect: '/404'} и вашим условием перенаправить пользователя, не вошедшего в систему, если страница требует trueAuth.

Чтобы решить проблему, добавьте другое условие, подобное этому: 

if (isLoggedIn === null){
    if (requiresAuth && !isLoggedIn.user) {
        if (!to.matched.length) {
           next('/404');
        } else {
           next('/');
        }
    } else {
        next();
    }

} else {
    next();
}
...