How to protect routes with NextAuth.js middleware

Auth Middleware

Protect routes at the edge before they render. Use the auth export from auth.ts as your middleware:

// middleware.ts
export { auth as middleware } from '@/auth'

export const config = {
  matcher: ['/((?!api|_next/static|_next/image|favicon.ico).*)'],
}

The authorized callback in your authConfig controls the logic:

// auth.config.ts
callbacks: {
  authorized({ auth, request: { nextUrl } }) {
    const isLoggedIn = !!auth?.user
    const isProtected = nextUrl.pathname.startsWith('/dashboard')
      || nextUrl.pathname.startsWith('/settings')

    if (isProtected && !isLoggedIn) return false  // Redirect to signIn page
    return true
  },
},

Role-Based Access

authorized({ auth, request: { nextUrl } }) {
  const user = auth?.user as { role?: string } | undefined
  const isAdmin = user?.role === 'ADMIN'
  const isAdminRoute = nextUrl.pathname.startsWith('/admin')

  if (isAdminRoute && !isAdmin) {
    return Response.redirect(new URL('/unauthorized', nextUrl))
  }
  return true
}

Returning false from authorized redirects to the configured signIn page. Returning a Response.redirect() lets you redirect to a custom page like /unauthorized. The middleware runs on every request matched by the config, so keep the logic lightweight — no database calls.