Πώς χειρίζεσαι την ταυτοποίηση σε μια Next.js App Router εφαρμογή;

Question

Accepted Answer

Η ταυτοποίηση στο App Router εκτείνεται σε πολλά επίπεδα — sessions, middleware, ελέγχους στην πλευρά του διακομιστή, και προστασία Server Actions. Η σύγχρονη προσέγγιση ευνοεί την **επαλήθευση session στην πλευρά του διακομιστή** έναντι ελέγχων που γίνονται μόνο στον πελάτη. ## Στρατηγική session ```text Cookie-based sessions (httpOnly cookie): ✓ Store a signed session id or encrypted JWT in an httpOnly, secure cookie ✓ httpOnly = not readable by JavaScript → protects against XSS token theft ✓ Use a library: Auth.js (NextAuth), Clerk, Lucia, or a custom solution ``` ## 1. Χονδρή προστασία στο middleware (γρήγορη, αλλά όχι το σύνολο της ιστορίας) ```ts // middleware.ts — quick check: does a session cookie exist? export function middleware(req: NextRequest) { const session = req.cookies.get("session")?.value; if (req.nextUrl.pathname.startsWith("/dashboard") && !session) { return NextResponse.redirect(new URL("/login", req.url)); } return NextResponse.next(); } ``` Το Middleware εκτελείται στο Edge πριν από κάθε matched request — ιδανικό για φθηνές ανακατευθύνσεις. Αλλά θα πρέπει να κάνει μόνο έναν *ελαφρύ* έλεγχο παρουσίας. μην βασίζεσαι σε αυτό ως την μόνη εξουσιοδότηση (το cookie θα μπορούσε να είναι άκυρο). ## 2. Επαληθεύστε το session όπου χρησιμοποιείτε τα δεδομένα (η πραγματική πύλη) ```tsx // app/dashboard/page.tsx — verify on the server, in the page itself import { redirect } from "next/navigation"; export default async function Dashboard() { const user = await getCurrentUser(); // validates the session cookie server-side if (!user) redirect("/login"); // authoritative check return

Welcome {user.name}

; } ``` Αυτή η επαλήθευση στην πλευρά του διακομιστή (στο Server Component) είναι ο **αυθεντικός** έλεγχος — επικυρώνει πραγματικά το session και φορτώνει τον χρήστη. ## 3. Προστατεύστε επίσης τα Server Actions και τα Route Handlers ```tsx "use server"; export async function deletePost(id: string) { const user = await getCurrentUser(); if (!user) throw new Error("Unauthorized"); // never trust the caller if (post.authorId !== user.id) throw new Error("Forbidden"); // authorization await db.post.delete({ where: { id } }); } ``` Τα Server Actions είναι δημόσια endpoints — **πάντα επανελέγχου την ταυτοποίηση και την εξουσιοδότηση μέσα τους**, ανεξάρτητα από την προστασία σε επίπεδο UI. ## Γιατί στρωματικοί έλεγχοι ```text Middleware → fast redirect for the common case (better UX, not security-critical) Server Component/Action → real verification (security boundary) Never rely on hiding UI in the client as a security measure ``` ## Γιατί είναι σημαντικό Η ταυτοποίηση στο App Router είναι άμυνα σε βάθος: httpOnly cookies (sessions ασφαλείς από XSS), middleware για γρήγορες ανακατευθύνσεις, και — κρίσιμα — **επαλήθευση session στην πλευρά του διακομιστή σε κάθε σημείο πρόσβασης δεδομένων και αλλαγής**. Το κοινό, επικίνδυνο λάθος είναι να θεωρείς τον έλεγχο middleware ή κρυμμένο client UI ως επαρκή. η πραγματική προστασία έρχεται από την επικύρωση του session και της εξουσιοδότησης στον διακομιστή όπου γίνονται ευαίσθητα δεδομένα ανάγνωσης ή αλλαγής.