Перейти к основному содержимому

Вход по email с использованием Firebase

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

Перед началом работы с этим разделом:

Включение провайдера входа по email в Firebase

  1. Откройте консоль Firebase и нажмите Authentication
  2. Нажмите кнопку Get started (она может быть не видна, если вы уже настроили другие формы аутентификации).
  3. Выберите вкладку Sign-in method.
  4. Нажмите на Email/Password (в разделе 'Native providers'). Если вы уже добавили другой провайдер, нажмите Add new provider, а затем нажмите на Email/Password.
  5. Найдите переключатель Email/Password и включите его.
  6. Нажмите кнопку Save.

Добавление экрана входа с полями Email/Password

В FlutterFlow вы можете использовать функцию Page Templates для создания новой страницы аутентификации, которая включает компоненты "Create Account" и "Log In".

Эта настройка соответствует процессу аутентификации Firebase, который требует от пользователей сначала создать аккаунт с использованием email, а затем позволяет им войти с использованием зарегистрированного email ID.

Действие Create Account

Действие Create Account — это точка входа для новых пользователей в любом приложении. Оно заключается в установлении учетных данных пользователя и предоставлении ему доступа впервые. Это действие включает сбор необходимой информации, такой как email, пароль и, возможно, другие детали, специфичные для пользователя, например, имя или номер телефона.

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

Чтобы включить это в FlutterFlow, выполните следующие шаги:

  1. Создайте страницу с использованием Page Templates или с нуля и добавьте поля, такие как Email, Password и Confirm Password. В зависимости от ваших требований вы можете добавить дополнительные поля.
  2. Добавьте кнопку "Create Account" или "Sign Up" и прикрепите к ней действие.
  3. Найдите и выберите действие Create Account в разделе Backend/Database > Firebase Authentication.
  4. Установите Auth Provider в значение Email.
  5. Настройте поля для получения значений из переменных, которые обычно находятся в разделе Widget State > Field Name.
  6. Create User document включено по умолчанию. Это означает, что документ пользователя будет создан в коллекции 'users' после аутентификации пользователя, если он еще не существует, с деталями вроде email и UID.
    • Чтобы создать документ пользователя в другой коллекции, измените выпадающий список Created Document > Collection на нужную коллекцию.
    • Если при регистрации нужны дополнительные детали, такие как имя, возраст и дата рождения, нажмите + Add Field и задайте значение. Убедитесь, что эти поля уже созданы в коллекции 'users'.

create-account-action.png

Отправка ссылки для верификации email [Действие]

к сведению

Чтобы понять, почему верификация email обязательна при аутентификации с использованием email и пароля, обратитесь к Методы аутентификации

  1. Добавьте новое действие сразу после действия Create Account.

  2. Найдите и выберите действие Send Email Verification Link (оно находится в разделе Backend/Database > Firebase Authentication). Email пользователя автоматически извлекается из Firebase Authentication, и ссылка для верификации отправляется пользователю для подтверждения.

Пользователь должен получить ссылку для верификации email в своем почтовом ящике. При успешной верификации он увидит сообщение об успехе.

Вход [Действие]

Действие Log In, напротив, предназначено для пользователей, у которых уже есть аккаунт. Оно включает проверку предоставленных учетных данных возвращающегося пользователя против сохраненных данных для предоставления доступа к системе. Это действие критически важно для поддержания безопасного контроля доступа, поскольку оно гарантирует, что субъект, пытающийся получить доступ, действительно является тем, за кого себя выдает. Процесс обычно требует от пользователей предоставить зарегистрированный email и пароль, которые затем проверяются на правильность через вашу систему аутентификации.

Чтобы включить это в FlutterFlow, выполните следующие шаги:

  1. Создайте еще одну страницу входа с использованием Page Templates или с нуля и добавьте поля, такие как Email, Password.

  2. Добавьте кнопку "Log In" и прикрепите к ней действие.

  3. Найдите и выберите действие Log In в разделе Backend/Database > Firebase Authentication.

  4. Настройте поля для получения значений из переменных, которые обычно находятся в разделе Widget State > Field Name.

login-action.png

к сведению

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

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

Чтобы убедиться, что вы успешно добавили аутентификацию по email и что пользователи создаются, перейдите в раздел Firebase project > Authentication > Users и проверьте записи пользователей.