Authentication & Authorization

Route Access Configuration

In Jumbo, route access is managed by specifying paths in two arrays: publicPaths and anonymousPaths, which are defined in the file /src/config/routes/path.ts. This setup helps in controlling access to different parts of the application based on the user's authentication status.

Route Access Arrays

// /src/config/routes/path.ts

export const publicPaths = ['auth/login-1'];

export const anonymousPaths = ['/auth/login-1'];

Explanation of Terms

1. Public Path A path defined as a Public Path is accessible by both anonymous (not authenticated) and authenticated users. This means that any user, regardless of their authentication status, can access these routes.

2. Anonymous Path A path defined as an Anonymous Path is accessible only if the user is anonymous (not authenticated). Authenticated users will be redirected if they try to access these routes.

3. Authenticated Path Any path not specified in the publicPaths or anonymousPaths arrays is considered an Authenticated Path. These paths are accessible only by authenticated users. Attempting to access these routes without being authenticated will result in a redirection to the login page or an access denied message.

Examples

Here’s how you can configure different routes:

Public Path Example

export const publicPaths = ['/home', '/about'];

Anonymous Path Example

export const anonymousPaths = ['/auth/login-1'];

Middleware for Route Access Control

In Jumbo, two middleware functions, anonymousMiddleware and authMiddleware, are used to manage access to routes. These middleware functions determine whether a user can continue to the requested path or should be redirected based on their authentication status. The logic for this can be found in /src/middleware.ts.

Middleware Logic

The middleware logic checks the requested path and applies the appropriate middleware function based on whether the path is a public, anonymous, or authenticated path.

Here’s the code snippet from /src/middleware.ts:

import { anonymousMiddleware, authMiddleware } from '@/middleware/auth';
import { prefixLocale } from '@/middleware/locale';
import { isAnonymousPath, isPublicPath } from '@/utilities/helpers/path';
import { match } from '@formatjs/intl-localematcher';
import Negotiator from 'negotiator';
import { NextRequest, NextResponse } from 'next/server';

let headers = { 'accept-language': 'en-US,en;q=0.5' };
let languages = new Negotiator({ headers }).languages();
let locales = ['en-US', 'ar-SA', 'es-ES', 'fr-FR', 'it-IT', 'zh-CN'];
let defaultLocale = 'en-US';

match(languages, locales, defaultLocale);

export let activeLocale = defaultLocale;

export function middleware(request: NextRequest) {
  const { pathname } = request.nextUrl;

  const localeResponse = prefixLocale(request);
  if (localeResponse) {
    return NextResponse.redirect(localeResponse);
  }

  if (isPublicPath(pathname, activeLocale)) {
    return NextResponse.next();
  }

  if (isAnonymousPath(pathname, activeLocale)) {
    return anonymousMiddleware(request);
  }

  return authMiddleware(request);
}

Middleware Functions

• isPublicPath(pathname, activeLocale)

  • This function checks if the requested path is defined as a public path. If it is, the request is allowed to proceed without any further checks.

• isAnonymousPath(pathname, activeLocale)

  • This function checks if the requested path is defined as an anonymous path. If it is, the anonymousMiddleware function is called.

• anonymousMiddleware(request)

  • This middleware function handles requests to anonymous paths. It allows access if the user is not authenticated and redirects if the user is authenticated.

• authMiddleware(request)

  • This middleware function handles requests to authenticated paths. It allows access if the user is authenticated and redirects if the user is not authenticated.

• prefixlocal(request)

  • Detects if the request URL lacks a supported locale prefix. If it does, this function returns a redirect response that adds the locale to the path.

Middleware Flow

• Locale Check and Redirection

  • The middleware first checks if the request URL contains a valid locale prefix.

  • If not, it redirects the request to the same path prefixed with the user's preferred locale (as determined by Accept-Language headers).

• Request Path Check

  • If the locale prefix is already present:

    • The middleware checks if the path is a public path. If so, the request proceeds.

    • Otherwise, it checks if the path is an anonymous path. If so, anonymousMiddleware is invoked.

    • If the path is neither public nor anonymous, authMiddleware is invoked to enforce authentication.

• Access Control

  • Public Paths: Accessible by all users.

  • Anonymous Paths: Accessible only by anonymous users.

  • Authenticated Paths: Accessible only by authenticated users

  • Locale Redirect: Ensures all requests are locale-prefixed for internationalization support.

The current authMiddleware and anonymousMiddleware only checks for the accessToken's availability but you can customize these or write your own middleware to extend the functionality and support role based or promise based authorization.