Authentication

Manage JWT Token based Authentication.

JSON Web Token (JWT) is an open standard (RFC 7519) that defines a compact and self-contained way for securely transmitting information between parties as a JSON object.

This information can be verified and trusted because it is digitally signed. JWTs can be signed using a secret (with the HMAC algorithm) or a public/private key pair using RSA or ECDSA.

How does it work?

Only authenticated users can access dashboard pages. If a user is not authenticated, the user is redirected to the login page.

Main.ts

Main.ts

import { fakeBackend } from '@/utils/helpers/fake-backend';
fakeBackend();

router

router/index.ts

router.beforeEach((to) => {
  const auth = useAuthStore();

  const routeName = String(to.name ?? '');
  const authRequired = routeName.startsWith('/(main)') || to.matched.some((record) => record.meta.requiresAuth === true);

  if (authRequired && !auth.user) {
    auth.returnUrl = to.fullPath;
    return { path: '/login' };
  }

  if (auth.user && to.path === '/login') {
    return { path: auth.returnUrl || '/dashboard/default' };
  }
});