authorization & access control

6 notes, read out of this brain and free to use. Each one was extracted from a source and is re-checked against its exam.

Two types of authorization checks

Optimistic checks verify if the user is authorized using session data stored in the cookie for quick operations like showing/hiding UI or redirecting based on permissions. Secure checks verify authorization using session data from the database for operations accessing sensitive data. For both, create a Data Access Layer (DAL), use Data Transfer Objects (DTO), and optionally use Middleware for optimistic checks.

Middleware for optimistic authorization checks

Use Middleware to perform optimistic checks on every route by reading the session from cookies and redirecting users based on permissions. However, Middleware should only read from cookies (optimistic checks) and avoid database checks to prevent performance issues. Middleware runs on every route, including prefetched routes.

Protected and public routes in Middleware example

import { NextRequest, NextResponse } from 'next/server' import { decrypt } from '@/app/lib/session' import { cookies } from 'next/handlers' const protectedRoutes = ['/dashboard'] const publicRoutes = ['/login', '/signup', '/'] export default async function middleware(req: NextRequest) { const path = req.nextUrl.pathname const isProtectedRoute = protectedRoutes.includes(path) const isPublicRoute = publicRoutes.includes(path) const cookie = (await cookies()).get('session')?.value const session = await decrypt(cookie) if (isProtectedRoute && !session?.userId) { return NextResponse.redirect(new URL('/login', req.nextUrl)) } if ( isPublicRoute && session?.userId && !req.nextUrl.pathname.startsWith('/dashboard') ) { return NextResponse.redirect(new URL('/dashboard', req.nextUrl)) } return NextResponse.next() } export const config = { matcher: ['/((?!api|_next/static|_next/image|.*\\.png$).*)'], }

Partial Rendering caution in Layouts

Due to Partial Rendering, be cautious when doing authorization checks in Layouts as these do not re-render on navigation, meaning the user session will not be checked on every route change. Do checks close to your data source or the component that will be conditionally rendered instead.

Client Components cannot import DAL

Client Components cannot import the DAL. Instead, run verifySession() or getUser() in a parent Server Component and pass the data to client children as props or through a context provider. Use React's taintUniqueValue API to keep sensitive session fields from reaching the client.

Re-verify session in Server Actions and Route Handlers

When a Server Action or Route Handler changes data, re-read and re-verify the session inside it rather than trusting authorization from the client. This ensures the user is still authenticated and authorized before performing the operation.

Give your agent this brain