Next.js + Supabase Auth

Best practices for secure authentication in the App Router.

Core Principles

1. •Middleware First: Check session and refresh tokens in middleware.ts.
2. •Server Verification: Use auth.getUser() in Server Components for security (don't trust getSession alone on the server).
3. •Cookie Safety: Ensure httpOnly, secure, and sameSite: lax for session cookies.

Patterns

• •Protected Routes: Redirect unauthenticated users in middleware or at the page level.
• •Auth Callback: Handle PKCE flow in app/auth/callback/route.ts.
• •Client Sync: Use onAuthStateChange to keep client state in sync with server.

Related

• •Implementation in this project: src/lib/auth.ts, app/api/auth/