CODEWITHSUNDEEP
javascriptvue.jsaxiosvuetify.js
Lykas
Lykas

Reputation: 120

how to make router access by token

I've got token by back end

 axios.post(process.env.VUE_APP_LOGIN, payload)
        .then(response => {
          const {access_token, token_type, user} = response.data;
          this.token = access_token
          this.$store.commit('auth/set_Token', access_token)
          this.store.commit('auth/set_User', user)
          this.$store.commit('auth/set_TokenType', token_type)
          axios.defaults.headers.post['Authorization'] = `Bearer ${access_token}`

and i want to do routers public and authenticated. but i cant understand how to verify and do header [authenticated]

Vue.use(VueRouter)


const routes = [
    {
        name: 'DataBase',
        path: '/table',
        component: Table,
    },
    {
        name: 'Home',
        path: '/',
        component: Main,
    },
    {
        name: 'Login',
        path: '/login',
        component: Login,
        meta: {
            public: true,
            hideHeader: true,
            hideFooter: true,
        },

    },
    {
      name: 'Dictionary',
      path: '/dovid',
      component: Dovid,
      meta: {
          
      }
    },
]

const router = new VueRouter({
    mode: 'history',
    base: process.env.BASE_URL,
    routes
})

i need to use router before each? or what? maybe you have some good docs I will be very grateful

Upvotes: 1

Views: 378

Answers (1)

vlreshet
vlreshet

Reputation: 325

You cau use "router.beforeEach" for that. Here is an example

router.beforeEach((to, from, next) => {
// if route is not auth-protected, or user is logged
if (to.matched.some(matchAuthProtectedRoute) && !isLogged()) {
    next({
        path: '/login',
        query: {
            back: to.fullPath
        }
    });

    return;
}

next();
});

Upvotes: 2

Related Questions