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

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

Предварительные требования

Перед началом работы с этим разделом убедитесь, что вы выполнили следующие шаги:

1. Все шаги в разделе Настройка Supabase
2. Начальную настройку для аутентификации.

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

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

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

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

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

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

1. В вашем проекте Supabase перейдите в раздел Authentication > Provider.
2. Откройте раздел Email и отключите опции Confirm email и Secure email change.

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

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

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

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

Добавление действия [Create Account]

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

1. Действие Supabase Create Account
2. Действие Supabase Insert row
3. Действие Navigate

Первое действие создаёт учётную запись в Supabase и добавляет электронную почту и пароль в таблицу "auth.users" (т. е. Protected schemas > schema auth). Однако это действие не создаёт запись в таблице "users", которую вы создали здесь. Для этого нужно добавить ещё одно действие под названием Supabase insert row с данными пользователя, такими как email и profile_pic. После создания записи вы можете перейти на главную страницу с помощью действия navigate.

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

Добавление действия [Log In]

Чтобы разрешить пользователям входить в систему с помощью своих учётных данных, вы можете использовать действие Log In.

Добавление действия [Logout]

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

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

Чтобы убедиться, что аутентификация по электронной почте добавлена успешно, перейдите в ваш проект Supabase > Table Editor > выберите таблицу "users" и проверьте записи пользователей.

Что дальше?

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

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