🔄 Сброс пароля в Supabase: Трехслойная реализация

🟢 Слой 1: Логика и Flow (Архитектура)

На этом уровне мы определяем путь пользователя без привязки к конкретным строчкам кода. Это “скелет” бизнес-процесса.

  1. Инициация (Start): Пользователь вводит Email на странице логина. Система отправляет запрос в Supabase Auth.
  2. Доставка (Email): Supabase генерирует ссылку с временным токеном и отправляет её на почту.
  3. Перехват (Redirect): Пользователь кликает по ссылке. Браузер/Приложение перехватывает ссылку и открывает специальную страницу /password-reset.
  4. Авторизация (Session): В момент открытия страницы по ссылке, Supabase автоматически создает временную сессию для текущего пользователя.
  5. Финализация (Update): Пользователь вводит новый пароль. Приложение отправляет запрос на обновление данных UserAttributes.

🛠 Слой 2: Инфраструктура (Supabase Side)

Этот слой отвечает за то, чтобы бэкенд “знал”, куда возвращать пользователя после клика в письме. Без этих настроек Слой 1 не сработает.

1. Настройка Redirect URL

В консоли Supabase (Authentication URL Configuration) добавьте адрес: https://yourapp.com/password-reset (или myapp://reset для мобильных приложений).

2. Email Template

Отредактируйте шаблон Reset Password (Authentication Email Templates), чтобы кнопка вела на ваш URL:

<h2>Сброс пароля</h2>
<p>Нажмите на кнопку ниже:</p>
<a
  href="{{ .ConfirmationURL }}&redirect_to=https://yourapp.com/password-reset"
  style="background: #6d5dfc; color: white; padding: 12px; border-radius: 8px;"
>
  Установить новый пароль
</a>

💻 Слой 3: Реализация (FlutterFlow & Code)

Финальный слой — конкретные Custom Actions для взаимодействия с API.

1. Запрос сброса (sendResetEmail)

Вызывается кнопкой “Восстановить” на экране входа.

Future<String?> sendResetEmail(String email) async {
  final supabase = SupaFlow.client;
  try {
    // Supabase сам отправит письмо на указанный Email
    await supabase.auth.resetPasswordForEmail(email);
    return null; // Успех
  } catch (e) {
    return e.toString();
  }
}

2. Обновление пароля (finalizeNewPassword)

Вызывается на странице /password-reset. Важно: К этому моменту пользователь уже авторизован временной сессией из письма.

Future<String?> finalizeNewPassword(String newPassword) async {
  final supabase = SupaFlow.client;
  try {
    await supabase.auth.updateUser(
      UserAttributes(password: newPassword)
    );
    return null;
  } catch (e) {
    return e.toString();
  }
}

📺 Рекомендуемые видео