Was sind SANCTUM_STATEFUL_DOMAINS und warum sind sie wichtig?

Laravel Sanctum nutzt Cookie-basierte Session-Authentifizierung für Single Page Applications (SPA). Damit Laravel Anfragen von deinem entkoppelten Next.js-Frontend akzeptiert und Cookies auswertet, muss die Next.js-Domain in der Liste SANCTUM_STATEFUL_DOMAINS eingetragen sein. Ohne diesen Eintrag verweigert Sanctum das Einloggen über Cookies.

Warum erhalte ich bei Next.js SSR mit Laravel Sanctum immer den Fehler 401 Unauthorized?

Next.js Server Components (SSR) führen HTTP-Requests direkt vom Node.js-Server aus, nicht vom Browser des Benutzers. Daher sendet der Node.js-Server standardmäßig keine Cookies mit. Du musst die Session-Cookies (laravel_session und XSRF-TOKEN) manuell aus den Client-Headern auslesen und an den fetch-Request zum Laravel-Backend anhängen.

Was muss in SESSION_DOMAIN bei Laravel Sanctum eingetragen werden?

Die SESSION_DOMAIN bestimmt den Gültigkeitsbereich des Session-Cookies. Sie sollte so gesetzt sein, dass sowohl das Backend als auch das Frontend darauf zugreifen können. Wenn das Backend auf api.domain.com und das Frontend auf domain.com läuft, lautet die SESSION_DOMAIN '.domain.com' (beachte den führenden Punkt). Bei der lokalen Entwicklung mit localhost oder IP-Adressen sollte sie leer bleiben oder auf 'localhost' stehen.

HEADLESS AUTH & CORS CONFIGURATOR

Konfiguriere Laravel Sanctum Cookie-Authentifizierung und Next.js CORS synchron. Keine Mismatches oder 401 Fehler mehr.

Domains festlegen

Next.js Frontend URLDie Adresse, unter der deine Next.js-Anwendung im Browser läuft.

Laravel Backend URLDie API-URL deines Laravel-Backends.

Getrennte Domains (oder Localhost)

Cookies werden als Third-Party-Cookies eingestuft. Stelle sicher, dass du lokal HTTPS nutzt (z.B. Laravel Valet/Herd) oder die Session-Cookies über einen Next.js-Proxy leitest, falls du Anmeldeschwierigkeiten hast.

.env

# Laravel .env Konfiguration
APP_URL=http://localhost:8000
FRONTEND_URL=http://localhost:3000

# Erlaubt Cookie-Zuweisung für dieses Frontend
SANCTUM_STATEFUL_DOMAINS=

# Cookie-Gültigkeit (Punkt am Anfang erlaubt Subdomain-Sharing)
SESSION_DOMAIN=
SESSION_DRIVER=cookie
SESSION_SECURE=true

Konfigurations-Handbuch

Warum Cookie-Auth in Next.js komplex ist

Laravel Sanctum nutzt standardmäßig Stateful Session Cookies. Im Gegensatz zu mobilen Apps oder Token-Verfahren ist dies die sicherste Methode, da Browser die Cookies automatisch mitsenden. Bei Next.js gibt es jedoch eine Besonderheit:

Die Krux mit Next.js Server Components (SSR)

Next.js Server-side Rendering führt fetch-Requests auf dem Node.js-Server aus. Weil Server-Anfragen standardmäßig keinen Zugriff auf die Cookies im Browser des Users haben, werden diese Requests von Laravel mit einem 401 Unauthorized blockiert. Mit unserer Next.js Middleware schleifen wir diese Cookies bei API-Anfragen durch.

CORS-Handshake & CSRF Schutz

Bevor Next.js POST- oder PUT-Daten senden darf, muss der CSRF-Token geholt werden. Laravel stellt hierfür den Endpunkt `/sanctum/csrf-cookie` zur Verfügung. Du musst diesen Request zwingend vor dem eigentlichen Loginszenario abrufen, um das CSRF-Token in deinem Header-Verlauf mitsenden zu können.

Nächste Schritte & Kontakt

Dein Webprojekt professionell umsetzen?

Du brauchst professionelle Unterstützung bei deinem Web-Projekt? Wir helfen dir bei der Umsetzung von modernen Layouts, performanten Animationen und maßgeschneiderten Lösungen, damit dein Projekt wirklich glänzt.

Webinteger kontaktieren

Sende uns deine Testergebnisse direkt zu. Wir analysieren dein Projekt im Detail und erstellen dir einen Fahrplan zur Behebung.

Beratung anfragen

Nächster Test: Next.js Fetch Builder

Nimm deine URL mit zum nächsten Tool, um deine SEO-Analyse zu vervollständigen und weitere versteckte Fehler aufzudecken.

URL zu Next.js Fetch Builder übertragen