Simples Vuejs route guard with password only

user_9300334 0
Viewed 164

So, I'm trying to make a route guard where a user is prompted for a password before being redirected to a dashboard, but with everything setup I still can access the dashboard by typing /dashboard at the address bar. What I have:

export default new Router({
  mode: 'history',
  routes: [
    {
      path: '/dashboard',
      name: 'dashboard',
      component: home,
      props: true,
      beforeEnter: (to, from, next) =>{
        if (to.params.senha == to.params.mestre){
          next()
        } else{
          next({name: 'login'})
        }
      }

where 'senha' is the users input and 'mestre' is a stored variable master password in the login component data.

And this is what is sent by the login component to the router

toApp() {
      this.$router.push({
        name: "dashboard",
        params: { senha: this.senha, mestre: this.mestre }
      });

I know it is not a safe method for authing or anything related, its very simple for a very simple application.

what I am missing?

vue-router vue.js
1 Answers

The above logic works fine and there is no bug found

try to hardcode the values from router push and test

this.$router.push({
        name: "dashboard",
        params: { senha: "senha", mestre: "senha" }
      });

If it works fine, then try to print the value in console before routing

console.log(this.senha, this.mestre);
this.$router.push({
        name: "dashboard",
        params: { senha: this.senha, mestre: this.mestre }
      });

Still if you find any issue, try to check the console for any errors

user_105557850
Related