Nuxt Auth Local Token cookie sets logged in status to true

Question

I am currently using Nuxt Auth for my login and session management. Everything is going smoothly. However, I have a problem with the way my set up is handling cookies. I am not sure where I went wrong. Whenever I set the auth._token.local in the application tab of dev tools, it sets the logged in status to true. Here are my configurations:

nuxt.config.js

auth: {
    // cookie: false,
    watchLoggedIn: false,
    redirect: {
      callback: false,
      login: '/',
      logout: '/',
      home: '/home'
    },
    strategies: {
      local: {
        token: {
          property: 'token',
          type: 'Bearer ',
          maxAge: 7200
        },
        user: {
          property: false
        },
        endpoints: {
          login: {
            url: '/api/authenticate',
            method: 'post'
            propertyName: 'data.token'
          },
          logout: false,
          user: false
        },
        autoLogout: true
      }
    }
  },
  router: {
    middleware: [ 'auth' ]
  }

setting the highlighted cookie to true will let the user browse the protected pages.

Answer 1

Having the front-end state being at true may tell to your Vue app that you do have the rights to access the protected pages but your user will actually need to have a valid Bearer token (to fetch the actual sensitive data).
You can't really fake this one because it needs to match the one on the backend.

TLDR: you're safe because what only matters is the backend validation when you ask for sensitive data. Frontend is just a fancy shell that can be "hacked" with no real implications.

Of course, if you hard-code sensitive data in your .vue files (no need to fetch them), yep it's an issue. But I suppose you're not doing that.