Capítulo 137 de 456

unauthorized.js

Core Idea

Arquivo experimental que renderiza UI quando a função unauthorized() é invocada durante autenticação, retornando status 401.

Key Concepts

  • unauthorized.js: componente sem props, exportado como default; renderizado junto com status HTTP 401.
  • unauthorized(): função de next/navigation chamada dentro de uma página/DAL para disparar o arquivo.
  • Feature experimental, não recomendada para produção no momento da doc.

Code Examples

import { verifySession } from '@/app/lib/dal'
import { unauthorized } from 'next/navigation'

export default async function DashboardPage() {
  const session = await verifySession()

  if (!session) {
    unauthorized()
  }

  return <div>Dashboard</div>
}
  • O que demonstra: checagem de sessão que dispara unauthorized() e renderiza app/unauthorized.tsx.
import Login from '@/app/components/Login'

export default function Unauthorized() {
  return (
    <main>
      <h1>401 - Unauthorized</h1>
      <p>Please log in to access this page.</p>
      <Login />
    </main>
  )
}
  • O que demonstra: UI customizada de 401 com componente de login embutido.

Anti-patterns

  • Usar em produção sem avaliar o status experimental: a doc explicitamente recomenda cautela; feedback via GitHub é esperado.

Key Takeaways

  1. unauthorized.js é o par de not-found.js, mas para o caso 401 em vez de 404.
  2. Chame unauthorized() dentro da Data Access Layer ou da página, depois de verificar a sessão.
  3. Ainda experimental (introduzido na v15.1.0); trate como sujeito a mudanças.

Connects To

  • unauthorized() function: função disparadora deste arquivo.
  • forbidden.js: convenção irmã para o caso 403 (autorizado a autenticar, mas sem permissão).