Гибридные мобильные приложения. Часть 2: авторизация пользователей

Продолжаем цикл материалов, посвященных разработке гибридных приложений. Этот текст будет целиком и полностью посвящен теме авторизации пользователей. В предыдущей статье мы описали процесс создания простого TODO приложения без авторизации. В результате у нас возник один глобальный список задач для всех пользователей. А это не есть хорошо. Для устранения возникшей проблемы мы сохраним отдельный список задач для каждого пользователя и введем авторизацию.

Исходные коды примера можно найти на GitHub:

https://github.com/c3gdlk/ionic_parse_todo

Как гласит народная мудрость, нормальные герои всегда идут в обход. Мы считаем себя вполне нормальными героями и неожиданно начинаем с выхода из приложения (Sign Out, Logout). Сперва нам предстоит разобраться с его размещением. В процессе же решения этой проблемы — ознакомиться с практикой использования боковых панелей (Sidebar) в Ionic.

Первое, что нам нужно — глобальный контроллер

Приступим. Добавляем глобальный контроллер. Его задача — обработка нажатия на кнопку Sign Out. Изменяем маршрутизацию и добавляем контроллер для состояния по умолчанию.

Созданный глобальный контроллер помещаем в файл js/controllers.js

Краткий комментарий к коду

$ionicSideMenuDelegate используется для управления боковой панелью. На страницах и экранах она нам не понадобится. Однако нам понадобится метод, который определит необходимость показа боковой панели. По факту она будет присутствовать на странице, но не будет открываться. На тех же страницах, где боковая панель вообще не нужна, мы просто не будем отображать ее иконку и реагировать на прокрутку влево.

Такова логика работы кнопки выхода из приложения:

  • сбросить авторизацию в Parse;
  • закрыть боковую панель;
  • перейти на страницу/экран авторизации.

Теперь вносим изменения в верстку нашего приложения. Как уже было сказано, боковая панель определяется для всего приложения, а не для конкретных страниц/экранов. В коде приложения мы всего лишь ограничиваем ее доступность в зависимости от статуса пользователя:

Объявляем ion-side-menus главным контейнером нашего приложения. Объявляем состав меню в левой боковой панели.


side, width, is-enabled — параметры, которые принимает директива.

Как любое стандартное view, наше view должно содержать директиву  <ion-content>. В нее помещается разметка меню приложения и кнопка выхода (Sign Out, событие на клик по этой кнопке будет прописано в MainController)

Объявляем главный контейнер для контента (не забываем о том, что сюда же нужно перенести код nav-bar):

Остается лишь добавить кнопку открытия меню в дополнение к реакции на горизонтальную прокрутку экрана.

Следующий шаг — создание таблицы в Parse с предопределенным типом User

fxasZlN

Получаем таблицу с полями

  • Username — имя пользователя;
  • Password — пароль;
  • authData — дата авторизации;
  • emailVerified — флаг верификации email;
  • Email — адрес электронной почты.

Прописываем новые маршруты:

В первой статье этого цикла мы нарушали каноны HMVC архитектуры. Теперь настало время их соблюсти. Создаем новый контроллер для авторизации пользователя

Для авторизации используем функцию logIn из Parse SDK. Она затачивается под получение валидной пары из имени пользователя и пароля. Но мы немного усложним задачу и дадим возможность авторизоваться с помощью email адреса. Для этого вводим проверку на наличие символа @ в имени пользователя. При положительном исходе, активируется поиск пользователя, зарегистрированного под этим адресом. Затем его данные передаются на обработку функции logIn.

Создаем шаблон страницы авторизации templates/sign-in.html

Вот и все.

Подведем итоги

  • Мы расширили функционал приложения. Теперь пользователь может авторизоваться и выходить из него.
  • Маршрутизацию и шаблоны стоит хранить в соответствующих директориях. Например, все, что связано с авторизацией следует размещать в директории authentication.
  • На сегодня мы еще не реализовали процедуру регистрации пользователей. Эту тему мы раскроем в одной из следующих статей.
  • Кроме того, в последующих статьях мы затронем тему валидации вводимых значений в формах нашего приложения.

Продолжение следует.

Будьте в курсе всех агро новостей

Ищи больше интересной информации в нашем TG-канале Подписаться

Похожие статьи

Заполните форму или свяжитесь
удобным для Вас способом

Контакты

г. Севастополь, ул. Руднева, д.41, 4 этаж технопарк ИТ-Крым +7 978 679-76-353 agro@crimeadigital.ru

Социальные сети

Нажимая на кнопку, вы даете согласие на обработку персональных данных и соглашаетесь c политикой конфиденциальности

Крым Диджитал приняла участие в стратегической сессии

Руководители Крым Диджитал приняли участие в стратегической сессии, которая прошла на базе СевГУ 10 июня. Вместе с Правительством Севастополя, Институтом информационных технологий и управления в технических системах СевГУ и приглашенными ИТ-компаниями города обсудили перспективу развития системы высшего образования в Севастополе.Представители бизнеса, власти и образовательной системы выступали со своим видением будущих потребностей региона в кадрах, поднимали насущные вопросы обучения студентов, прохождения практики и дальнейшего трудоустройства. Крым Диджитал является амбассадором идеи образования и взращивания молодых кадров, развивает образовательные проекты и на протяжении 5 последних лет ведет активную работу в направлении поддержки и развития молодых специалистов ИТ-отрасли Крыма.

Руководители Крым Диджитал приняли участие в стратегической сессии, которая прошла на базе СевГУ 10 июня.

Вместе с Правительством Севастополя, Институтом информационных технологий и управления в технических системах СевГУ и приглашенными ИТ-компаниями города обсудили перспективу развития системы высшего образования в Севастополе.
Представители бизнеса, власти и образовательной системы выступали со своим видением будущих потребностей региона в кадрах, поднимали насущные вопросы обучения студентов, прохождения практики и дальнейшего трудоустройства.

Крым Диджитал является амбассадором идеи образования и взращивания молодых кадров, развивает образовательные проекты и на протяжении 5 последних лет ведет активную работу в направлении поддержки и развития молодых специалистов ИТ-отрасли Крыма.

Выпуск курса Software Testing

Мы поздравляем выпускников нашего первого в этом году курса Крым Диджитал Академии по Software Testing! Всего курс успешно завершили 13 человек. В течение 2 месяцев несмотря на теплую погоду и манящее море ребята ответственно посещали занятия 2 раза в неделю, делали домашние задания и проверочные работы. Трое начинающих специалистов теперь стажеры нашей компании. Следующий курс намечен на август. Не пропусти анонс записи!

Мы поздравляем выпускников нашего первого в этом году курса Крым Диджитал Академии по Software Testing!

Всего курс успешно завершили 13 человек. В течение 2 месяцев несмотря на теплую погоду и манящее море ребята ответственно посещали занятия 2 раза в неделю, делали домашние задания и проверочные работы. Трое начинающих специалистов теперь стажеры нашей компании.

Следующий курс намечен на август. Не пропусти анонс записи!

Лицензия на образовательную деятельность

В 2022 году мы получили лицензию на образовательную деятельность по программам дополнительного профессионального образования! Теперь мы можем обучать специалистов по направлениям Ruby on Rails, ReactJS и Software Testing и выдавать удостоверения о повышении квалификации государственного образца.
В 2022 году мы получили лицензию на образовательную деятельность по программам дополнительного профессионального образования! Теперь мы можем обучать специалистов по направлениям Ruby on Rails, ReactJS и Software Testing и выдавать удостоверения о повышении квалификации государственного образца.

Мы вошли в Реестр эффективно и социально значимых предприятий.

По результатам ежегодной финансово-экономической аналитики Межотраслевой рейтинговой компании Крым Диджитал включена в Реестр эффективных и социально значимых предприятий. По итогу аналитики, в рамках отрасли (ОКВЭД 62.01) и региона Крым, CDG вошло в 4% лучших компаний страны, с результатом – 92 балла!
По результатам ежегодной финансово-экономической аналитики Межотраслевой рейтинговой компании Крым Диджитал включена в Реестр эффективных и социально значимых предприятий. По итогу аналитики, в рамках отрасли (ОКВЭД 62.01) и региона Крым, CDG вошло в 4% лучших компаний страны, с результатом – 92 балла!