[Vuejs]-How to run js code before everything in the page? I have session check in js and it should redirect to another page

by

0👍

✅

Like @Jayem163 said in the notes I would run the authentication verification in your router on beforeRouteEnter Below is a basic example. The router code will run before any render of your component. This way you don’t have duplicate code for each route.

import Vue from 'vue'
import Router from 'vue-router'

Vue.use(Router)

// no authentication required -- OPTIONAL
const noAuthenticationRequired = (to, from, next) => {
  // in my apps right here I force logout. You don't want to go to a login page while logged in. But it's optional
  next()
}

// make sure user is authenticated
const requiresAuthentication = (to, from, next) => {
  // YOUR CHECK AUTH CODE WOULD GO HERE //
  if (success) {
    return next()   
  }

  // not successful
  next('/login')
}

export default new Router({
  routes: [
    {
      path: '/',
      name: 'dashboard',
      beforeEnter: requiresAuthentication, // this route will require authentication
      component: () => import('./views/Dashboard.vue')
    },
    {
      path: '/login',
      name: 'login',
      beforeEnter: noAuthenticationRequired,
      component: () => import('./views/Login.vue')
    },
    {
      path: '/register',
      name: 'register',
      beforeEnter: noAuthenticationRequired,
      component: () => import('./views/Register.vue')
    },
    {
      path: '/password/forgot',
      name: 'forgotPassword',
      beforeEnter: noAuthenticationRequired,
      component: () => import('./views/ForgotPassword.vue')
    }
  ]
})

Leave a comment