nextjs-supabase-auth

Expert integration of Supabase Auth with Next.js App Router Use when: supabase auth next, authentication next.js, login supabase, auth middleware, protected route.

1. Zainstaluj wymaganą bibliotekę @supabase/ssr, która umożliwia prawidłową integrację Supabase Auth z App Router. Ta biblioteka obsługuje przepływ sesji oparty na ciasteczach i zarządzanie tokenami po stronie serwera.

2. Skonfiguruj klientów Supabase dla różnych kontekstów — osobno dla middleware, Server Components i Client Components. Każdy kontekst wymaga innej konfiguracji, aby zapewnić bezpieczeństwo i wydajność.

3. Zaimplementuj middleware, które będzie chronić trasy i odświeżać sesje. Middleware powinno przechwytywać żądania, weryfikować tokeny w ciasteczkach i automatycznie odświeżać sesję, jeśli jest to konieczne.

4. Utwórz trasę callback dla OAuth, która będzie obsługiwać wymianę kodu autoryzacyjnego na sesję. Ta trasa jest wywoływana przez dostawcę OAuth po zatwierdzeniu przez użytkownika.

5. Używaj Server Actions do operacji uwierzytelniania, takich jak logowanie i wylogowanie. Server Actions zapewniają bezpieczne wykonanie operacji na serwerze bez ekspozycji logiki na kliencie.

6. Nigdy nie przechowuj tokenów ręcznie w localStorage ani nie ekspozycji ich w Client Components bez konieczności. Polegaj na ciasteczkach zarządzanych przez middleware i Server Actions.