Как защитить внешний интерфейс в Vue. js и Laravel?

Question

Как защитить Vue. js Route for Frontend. Я использую Laravel и vue. js для блога, но когда я маршрутизирую для веб-интерфейса и если администратор входит в систему, и когда я нажимаю URL-адрес веб-интерфейса, он собирается на панель входа, так как это предотвратить?

let routes = [
        { path: '/dashboard', component: require('./components/Dashboard.vue').default},
        { path: '/profile', component: require('./components/Profile.vue').default },
        { path: '/users', component: require('./components/Users.vue').default },
        //Frontent routes
        { path: '/', component: require('./components/frontend/blog/PublichHome.vue').default },
        { path: '/blog', component: require('./components/frontend/blog/Blog.vue').default },
        { path: '*', component: require('./components/NotFound.vue').default }
      ]

Answer 1

Я полагаю, вы используете VueRouter, да? Если это так, вы захотите добавить что-то вроде

function guard(to, from, next){
    if (to.name !== 'Login' && !isAuthenticated) next({ name: 'Login' })
    else next()
}

let routes = [
        { 
            path: '/dashboard', 
            component: require('./components/Dashboard.vue').default, 
            beforeEnter: guard(to, from, next),
        }
        { path: '/profile', component: require('./components/Profile.vue').default, beforeEnter: guard(to, from, next),},
        { path: '/users', component: require('./components/Users.vue').default, beforeEnter: guard(to, from, next),},
        //Frontent routes
        { path: '/', component: require('./components/frontend/blog/PublichHome.vue').default },
        { path: '/blog', component: require('./components/frontend/blog/Blog.vue').default },
        { path: '*', component: require('./components/NotFound.vue').default }
      ]

Вот ссылка на VueRouter Docs Navigation Guards по теме для получения дополнительной информации.