#3 Авторизация пользователей

Разбираем создание надежной системы авторизации на Bubble. Это базовый элемент любого сервиса, и важно сделать его правильно с первого раза. Начнем с главного – что должна уметь хорошая система авторизации? Она регистрирует пользователей, безопасно хранит их данные, позволяет входить через почту или соцсети и восстанавливать забытый пароль. На Bubble это можно реализовать за 20-30 минут.

Первый шаг – настройка базы данных. Создаем тип данных User с полями: email, password, first name, last name, phone. Добавляем поле is_verified для подтверждения почты и reset_token для восстановления пароля. Важный момент – Bubble автоматически шифрует пароли, вам не нужно беспокоиться об этом.

Второй шаг – создание страницы регистрации. Размещаем форму с нужными полями. В параметрах каждого поля указываем обязательность заполнения и формат данных. Для email включаем встроенную валидацию. Кнопке регистрации задаем действие Create New User, связывая поля формы с полями в базе.

Третий шаг – настройка входа. На странице логина достаточно двух полей: email и пароль. Используем действие Sign User In для проверки данных. Bubble сам сравнит введенный пароль с хешем в базе. При успешном входе перенаправляем пользователя на главную страницу.

Четвертый шаг – восстановление пароля. Создаем отдельную страницу с формой ввода email. При отправке формы генерируем уникальный токен, сохраняем его в базе и отправляем на почту ссылку для сброса пароля. На странице сброса проверяем токен и даем возможность установить новый пароль.

Бонус – вход через соцсети. Подключаем плагин Social Sign-on и настраиваем авторизацию через Google буквально в пару кликов. Bubble сам получит базовую информацию о пользователе и создаст учетную запись.

Готово. Теперь у вас есть профессиональная система авторизации, которая не уступает по функционалу большим сервисам. При этом разработка заняла минимум времени и не потребовала написания кода.

В следующих постах разберем другие важные элементы веб-приложений. Какие темы вам интересны? Пишите в комментариях.

repost

543

input message

напишите коммент

еще контент автора

еще контент автора

войдите, чтобы увидеть

и подписаться на интересных профи

в приложении больше возможностей

пока в веб-версии есть не всё — мы вовсю работаем над ней

сетка — cоциальная сеть для нетворкинга от hh.ru

пересекайтесь с теми, кто повлияет на ваш профессиональный путь