sakilanwar12/nextjs-typescript-skills

Authentification Next.js (Auth.js v5)

Règles

1. Centraliser la configuration dans auth.ts (export NextAuth() : handlers, auth, signIn, signOut). Ne jamais disperser les secrets des fournisseurs.
2. Protéger les routes dans middleware.ts (wrapper auth compatible Edge) et revérifier la session dans les Server Actions/mutations — le middleware est pour l'expérience utilisateur, pas pour l'autorisation.
3. Lire la session dans les Server Components via await auth(). Dans les Client Components, utiliser useSession() de next-auth/react avec <SessionProvider>.
4. Ne jamais exposer les secrets (AUTH_SECRET, clés des fournisseurs) avec le préfixe NEXT_PUBLIC_. Valider les variables d'environnement avec Zod au démarrage.
5. Vérifications de rôles : étendre le type de session via l'augmentation de module (user.role), appliquer côté serveur.

Patterns

// auth.ts
import NextAuth from 'next-auth';
import GitHub from 'next-auth/providers/github';

export const { handlers, auth, signIn, signOut } = NextAuth({
  providers: [GitHub],
  callbacks: {
    async session({ session, token }) {
      if (session.user) (session.user as { role?: string }).role = token.role as string;
      return session;
    },
    async jwt({ token, user }) {
      if (user) token.role = (user as { role?: string }).role ?? 'user';
      return token;
    },
  },
});

// middleware.ts
export { auth as middleware } from '@/auth';
export const config = { matcher: ['/dashboard/:path*', '/admin/:path*'] };

// app/api/auth/[...nextauth]/route.ts
import { handlers } from '@/auth';
export const { GET, POST } = handlers;

// Server Component gate
import { auth } from '@/auth';
import { redirect } from 'next/navigation';

export default async function AdminPage() {
  const session = await auth();
  if (!session?.user) redirect('/login');
  if ((session.user as { role?: string }).role !== 'admin')
    redirect('/dashboard');
  return <AdminView />;
}

// types/next-auth.d.ts — augmentation de rôle
import 'next-auth';
declare module 'next-auth' {
  interface User { role?: string }
}

Liste de vérification

• Le matcher de middleware.ts couvre-t-il les chemins protégés ?
• La session est-elle revérifiée dans les actions/mutations ?
• Aucun secret exposé côté client ?
• Le rôle est-il appliqué côté serveur, pas seulement par une interface utilisateur cachée ?
• La déconnexion et l'expiration de session sont-elles gérées ?