Аутентификация по электронной почте

Аутентификация по электронной почте Supabase - это безопасный и простой способ позволить пользователям регистрироваться и входить в свое приложение, используя свою электронную почту и пароль.

Предпосылки

Прежде чем начать этот раздел, убедитесь, что у вас есть:

1. Завершены все шаги в Настройке Supabase
2. Завершена Начальная настройка, необходимая для аутентификации.

Добавление аутентификации по электронной почте

Посмотрим, как добавить аутентификацию по электронной почте Supabase, создав пример, который выглядит так:

Шаги по добавлению аутентификации по электронной почте Supabase следующие:

Настройка аутентификации по электронной почте в Supabase

Из-за некоторого поведения аутентификации Supabase вам необходимо отключить подтверждение электронной почты с стороны Supabase. Тем не менее, вы по-прежнему можете добавить логику подтверждения электронной почты самостоятельно в своем приложении, если пожелаете.

Вот как отключить подтверждение электронной почты с стороны Supabase:

1. В вашем проекте Supabase перейдите к Аутентификации > Провайдер.
2. Откройте раздел Email и отключите Подтверждение электронной почты и Безопасное изменение адреса электронной почты.

Отключение подтверждения электронной почты с стороны Supabase

Создание страниц

Добавим страницу, которая позволяет пользователям создавать аккаунты и входить. Чтобы ускорить процесс, вы можете добавить страницу из шаблона. Вот страница, добавленная из шаблона, и после некоторых модификаций она выглядит так:

Также посмотрите, как создать макет страницы, если вы хотите создать страницу с нуля.

Добавление действия "Создать аккаунт"

Теперь вы можете перейти к добавлению потока создания аккаунта, который в основном состоит из трех действий в следующем порядке:

1. Действие "Создать аккаунт" Supabase
2. Действие "Вставить строку" Supabase
3. Действие "Навигация"

Первое создает аккаунт в Supabase и добавляет электронную почту и пароль в таблицу "auth.users" (т.е., Защищенные схемы > схема auth). Однако это действие не создает запись в таблице "users", которую вы создали здесь. Для этого вам необходимо добавить еще одно действие, называемое "Вставить строку" Supabase с данными пользователя, такими как адрес электронной почты и фотография профиля. После создания записи можно перейти на домашнюю страницу, используя действие навигации.

Вот как это выглядит:

Добавление действия "Войти"

Чтобы позволить пользователям входить с их учетными данными, вы можете использовать это действие.

Добавление действия "Выйти"

Чтобы позволить пользователям выходить из вашего приложения, вы можете использовать это действие.

Проверка создания пользователя

Для проверки успешного добавления аутентификации по электронной почте вы можете перейти к своему проекту Supabase > Редактор таблиц > выбрать таблицу "users" и проверить записи пользователей.

Что дальше?

Теперь, когда вы успешно добавили аутентификацию по электронной почте Supabase в свое приложение, вы можете получить доступ к данным вошедшего пользователя, таким как адрес электронной почты, идентификатор пользователя, номер телефона, подтвержденная электронная почта и JWT-токен через меню Set Variable > Authenticated User.

Вот пример фильтрации списка дел на основе вошедшего пользователя, используя свойство идентификатор пользователя в меню Set Variable > Authenticated User.