Działający kod supabase-js v2 dla e-maila i hasła, magic linków, logowania OAuth, nasłuchiwania sesji i wylogowania, a także polityki row level security używające auth.uid().
Supabase Auth loguje ludzi przez e-mail i hasło, jednorazowe magic linki, kody na telefon lub dostawców OAuth, takich jak GitHub, a wszystko to przez obiekt supabase.auth w supabase-js. Każde logowanie daje sesję, której token trafia do Twojej bazy danych, gdzie polityki row level security porównują auth.uid() z kolumną user_id, aby zdecydować, co dana osoba może odczytać.
Metody logowania i wywołanie dla każdej z nich
Metoda
Wywołanie supabase-js v2
Dobre do
E-mail i hasło
auth.signUp / auth.signInWithPassword
Klasyczne konta
Magic link
auth.signInWithOtp({ email })
Brak haseł do zapomnienia
Kod SMS lub WhatsApp
auth.signInWithOtp({ phone })
Produkty mobile-first
Dostawca OAuth
auth.signInWithOAuth({ provider })
Logowanie jednym kliknięciem istniejącym kontem
Wylogowanie
auth.signOut()
Zakończenie sesji
Uwierzytelnianie to ta część projektu Supabase, którą ludzie najczęściej konfigurują źle: logowanie działa, ale dane są szeroko otwarte albo serwer ufa ciasteczku, któremu nie powinien. Wybierz metodę poniżej, aby dostać jej kod, a potem przejdź do sekcji o politykach, aby każda osoba widziała tylko własne wiersze.
Wybierz metodę logowania w selektorze kodu i skopiuj fragment do swojej aplikacji.
Włącz odpowiedniego dostawcę w panelu Supabase i dodaj adres swojej strony do dozwolonych adresów przekierowania.
Nasłuchuj zdarzeń uwierzytelniania, aby interfejs aktualizował się, gdy ktoś się loguje lub wylogowuje.
Włącz row level security w każdej tabeli z danymi osobowymi i dodaj polityki używające auth.uid().
Przy włączonym potwierdzaniu e-maila signUp zwraca użytkownika, ale sesję null, dopóki link nie zostanie kliknięty, więc pokaż komunikat o sprawdzeniu skrzynki zamiast dashboardu.
W politykach zapisuj funkcję jako (select auth.uid()). Postgres może ją wtedy obliczyć raz na zapytanie zamiast raz na wiersz.
auth.uid() ma wartość null dla żądań bez zalogowanego użytkownika, więc polityka porównująca ją z user_id po prostu nie dopasowuje niczego dla anonimowych odwiedzających.
Na serwerze nie ufaj getSession() odczytanemu z ciasteczek; wywołaj getUser() lub getClaims(), aby zweryfikować, kto pyta.
Klucz publiczny (anon) jest bezpieczny w przeglądarkach, bo ograniczają go polityki. Klucz sekretny lub service role pomija row level security i musi pozostać na serwerze.
Najczęściej zadawane pytania
Czy magic link w Supabase to to samo co OTP?
Oba zaczynają się od signInWithOtp. W przypadku e-maila wiadomość zawiera link, gdy szablon używa adresu potwierdzenia, a kod, gdy używa tokenu. Logowanie telefonem obsługuje tylko kody, przez SMS lub WhatsApp.
Jak dodać logowanie przez Google lub GitHub?
Włącz dostawcę w panelu, podając client ID i secret od tego dostawcy, a następnie wywołaj signInWithOAuth z jego nazwą i opcjonalnym adresem redirectTo. Osoba wraca na Twoją stronę już zalogowana.
Skąd wiem, kiedy użytkownik się loguje lub wylogowuje?
Zarejestruj onAuthStateChange. Zgłasza zdarzenia, w tym INITIAL_SESSION, SIGNED_IN, SIGNED_OUT, TOKEN_REFRESHED, USER_UPDATED i PASSWORD_RECOVERY, i zwraca subskrypcję, którą anulujesz, gdy komponent jest odmontowywany.
Dlaczego zalogowani użytkownicy nic nie widzą po włączeniu RLS?
Po włączeniu row level security tabela odmawia wszystkiego, dopóki polityka na to nie pozwoli. Dodaj politykę select dla roli authenticated, która porównuje (select auth.uid()) z kolumną właściciela.
Czy wybrać Supabase Auth czy Firebase Auth?
Oba obsługują popularne metody. Większa różnica to baza danych pod spodem; nasze porównanie Supabase i Firebase szczegółowo omawia ten wybór.
Sesje i tokeny
Po zalogowaniu supabase-js przechowuje krótkotrwały token dostępu i token odświeżania, a token dostępu odświeża automatycznie. Każde zapytanie wykonane przez tego samego klienta wysyła token dostępu i w ten sposób Postgres poznaje ID użytkownika.
W aplikacjach renderowanych po stronie serwera sesja żyje zamiast tego w ciasteczkach. Poradnik o uwierzytelnianiu w Next.js na tej stronie omawia tę konfigurację, więc ta strona skupia się na bibliotece klienckiej i regułach bazy danych.
Row level security to prawdziwy zamek
Ukrycie przycisku w interfejsie nie chroni danych, bo każdy może wywołać Twoje API kluczem publicznym. Polityki działają wewnątrz Postgres przy każdym żądaniu, dlatego to w nich egzekwuje się własność danych.
Pisz jedną politykę na akcję. Polityka select używa using, insert potrzebuje with check, aby nikt nie mógł tworzyć wierszy należących do kogoś innego, a update zwykle potrzebuje obu.
Polityki używające auth.uid()
Każda osoba czyta i zapisuje tylko własne notatki
Uruchom w edytorze SQL. Wartość domyślna wypełnia user_id z tokenu, a with check powstrzymuje każdego przed wstawianiem wierszy dla innego użytkownika.
E-mail i hasło
Utwórz konto, a potem się zaloguj. Przy włączonym potwierdzaniu data.session ma wartość null, dopóki link w e-mailu nie zostanie kliknięty.
Magic link
Wysyła e-mail z linkiem, który loguje osobę i przenosi ją na adres przekierowania.
OAuth (GitHub)
Przekierowuje do dostawcy i z powrotem. Najpierw włącz dostawcę i ustaw jego klucze w panelu.
Nasłuchiwanie sesji i wylogowanie
Utrzymuje interfejs w zgodzie z sesją i usuwa listener, gdy skończysz.