Отслеживание сессий и форм

Добро пожаловать в часть 3 нашего руководства по созданию вашего первого веб-сайта Flask. Мы поняли, что после этого, вероятно, собираемся разработать еще несколько частей - так что не волнуйтесь, ожидайте части 4 и 5! Мы поняли, что также хотели бы включить вставку и извлечение из баз данных, а также создать полноценный сайт со всем, что мы узнали!

Прочтите части 1 и 2 здесь:



Создание своего первого веб-сайта с помощью Flask - Часть 1
Hello World! medium.com





В этом посте мы рассмотрим две важные области улучшения взаимодействия пользователей с вашим простым веб-сайтом Flask. Мы рассмотрим:

· Отслеживание сеанса

· Использование форм для публикации информации во Flask

Отслеживание сеанса

Первые две части этой серии были посвящены основам: созданию базовых веб-страниц и HTML-шаблонов. Давайте начнем с чего-нибудь более интересного.

Если вы хотите создать страницу, которая включает в себя повторяющийся ввод данных пользователем, вам нужно каким-то образом отслеживать состояние каждого пользователя. Это позволит хранить данные в течение всего сеанса пользователя в веб-приложении. Сохраненные данные служат «памятью», где хранятся все, что произошло заранее.

Чтобы отслеживать предыдущие данные, использование «сеанса» предлагает временное хранилище, связанное с последним сеансом конкретного пользователя. В отличие от файлов cookie, данные «сеанса» хранятся на сервере. Сеанс - это временной интервал между входом пользователя в сервер и выходом из него.

В Flask «сеанс» клиентских данных хранится в виде файлов cookie в их браузере. Одна невероятно полезная функция Flask - это возможность импорта сессий. Он использует объект сеанса в процессе, аналогичном словарю, который связан с каждым пользователем веб-сайта. Кроме того, объект сеанса может хранить данные, относящиеся к пользователю, которые остаются даже после сбоя браузера или обновления страницы.

Вот необходимые настройки:

Поверх вашего скрипта Python выполните импорт сеанса. Кроме того, во время создания приложения вы должны включить две дополнительные строки после комментария (#):

ПРИМЕЧАНИЕ. Для практического использования (скажем, вы хотите запустить свой веб-сайт) рекомендуется применять секретный ключ, который не известен всем - данные сеанса могут содержать личную информацию о пользователе (ах), а доступ через файл cookie будет использовать все данные. для пользовательской сессии. Такая информация в чужих руках может не сработать.

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

Использование объекта сеанса для работы как в словаре Python

Двигаясь вперед, вы можете заставить объекты сеанса работать как словарь в Python. Эта функция - еще одна прелесть Flask, так как она работает аналогично обычному словарю Python.

Ниже приведен пример, в котором каждый раз при повторной загрузке страницы (в данном случае домашней) подсчитывается до 15. Он удаляется и запускается заново после 15 отсчетов:

Вот результат выполнения кода:

И сразу после этого введите в браузере localhost: 5000.

Чтобы увидеть это в своем браузере, перейдите к инструментам разработчика (например, Chrome: перейдите к инструментам разработчика в дополнительных инструментах) и выберите «Окно приложения».

Затем выберите «куки», чтобы увидеть ваши данные «сеанса», сохраненные в куки-файлах вашего браузера, но зашифрованные. Шифрование открывается с помощью созданного ранее «ключа».

Сервер обрабатывает файл cookie и расшифровывает его с помощью ключа. Он также может изменять и читать информацию в файлах cookie. Благодаря уникальному подходу Flask сеанс одного пользователя никогда не затрагивает другого пользователя.

Вы можете сделать дальнейшие подтверждения, используя окно инкогнито для проверки URL:

Использование сеанса для подсчета результата каждого номера страницы

Ниже приведен еще один экземпляр веб-приложения, использующего сеанс. На этот раз мы подсчитываем результат каждого номера страницы, полученного маршрутом с использованием сеанса.

Как только код будет выполнен в командной строке,

Ваш первый результат будет:

Введите в браузере localhost: 5000/15 и постоянно обновляйте страницу.

Вы заметите увеличение выпуска на 15.

Если изменить число в конце URL-адреса, оно увеличится на эту величину.

Оба примера могут помочь вам начать отслеживать пользователей, когда они заходят на ваш сайт.

Однако ввод данных в URL-адрес вручную - это не то, как мы передаем данные на веб-сайт! Вместо этого мы должны использовать формы.

Использование форм для публикации информации во Flask - Введение в Flask-WTF

Для обработки веб-форм в Flask Flask предоставляет расширение, называемое Flask-WTF extension. Это расширение прекрасно интегрируется с Flask. Экосистема Flask имеет больше расширений, которые являются очень важными частями способности Flask решать различные проблемы. Расширения Flask устанавливаются с помощью обычного пипса в Python. Для начала установим Flask-WTF:

pip install flask-wtf

Форма входа пользователя

Расширение Flask-WTF представляет веб-формы с использованием классов Python. Класс формы определяет поля формы как переменные класса. Давайте начнем с создания нового скрипта Python под названием «appforms.py», который позволит нам настроить форму входа пользователя, которая:

  • Просит пользователя предоставить имя пользователя и пароль.
  • Включает флажок «запомнить меня» и
  • Кнопка для «Войти».

Все символы Flask-WTF находятся в разделе flask_wtf. Из приведенного выше кода следует также отметить следующие моменты:

  • Базовый класс FlaskForm импортируется из flask_wtf.
  • Четыре класса используются для представления различных типов полей (все импортированы из пакета WTForms)
  • Для отдельного поля создаются объекты, которые служат переменной класса в классе LoginForm.
  • Описание или метка добавляется к каждому полю в качестве первого аргумента.

Необязательный аргумент валидаторов, применяемый к некоторым полям, дает им поведение валидации. DataRequired валидатор проверяет, является ли отправленное поле пустым или нет. Доступны и другие типы валидаторов.

Шаблоны форм

Следующим шагом является добавление форм в шаблоны HTML, которые помогут эффективно определять поля из appforms.py. Отрисовка себя в формате HTML упростит задачу. Ниже давайте создадим два шаблона, базовый шаблон и шаблон входа, которые называются FormBase.html и Formlogin.html:

Это код для Formbase.html:

Для второго шаблона мы повторно используем шаблон FormBase.html посредством наследования шаблона. Наследование шаблонов - еще одна отличная функция, доступная в jinja2. Оператор extends помогает в выполнении этой части приложения.

  • Этот шаблон Formlogin.html ожидает, что объект формы, созданный из класса LoginForm, будет передан в качестве аргумента, на который вы можете ссылаться как на форму.
  • Атрибут novalidate не применяет проверку к полям формы. Использование novalidate является полностью факультативным, но его полезно настроить, поскольку он позволяет проверять тестирование на стороне сервера.

На этом этапе вы можете запустить код python appforms.py и просмотреть формы в браузере с запущенным приложением, набрав http: // localhost: 5000 / login в адресной строке.

Получение данных формы и улучшение проверки полей

После запуска кода нажатие кнопки отправки приведет к ошибке «Метод запрещен».

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

Если вы попытаетесь ввести неверные данные в форму, вы заметите аналогичный механизм проверки. Следующая задача направлена ​​на улучшение взаимодействия с пользователем путем добавления сообщений об ошибках, указывающих на неудачную проверку. Валидаторы форм уже создают эти описательные сообщения об ошибках, поэтому недостающей частью является добавление некоторого логического шаблона, который помогает их отображать. Ниже приведен шаблон входа в систему (main.py) с дополнительными сообщениями о проверке полей для полей имени пользователя и пароля:

Эта версия использует аргумент метода в декораторе маршрута. Он просто сообщает Flask, что функция принимает запросы GET и POST, заменяя только запросы GET по умолчанию.

  • Метод form.validate_on_submit () выполняет всю работу по обработке формы. Всякий раз, когда пользователь нажимает кнопку отправки, эта функция собирает все прикрепленные данные и запускает поля валидаторов. Если все пойдет правильно, он вернет True, что означает, что данные действительны и могут быть обработаны.

Дополнительное обновление для шаблонов приведенного выше кода представлено ниже (formhelpers.html и index.html)

formhelpers.hmtl

Запуск этого кода и переход на localhost будут выглядеть так:

И после отправки:

Общее правило заключается в том, что к любым прикрепленным валидаторам поля добавляются сообщения об ошибках в виде ‹field_name›. ошибок. Выполнение кода без отправки данных ни для одного из полей возвращает простое сообщение об ошибке.

Код предлагает еще один отличный повод запустить приложение и посмотреть, как работает форма. убедитесь, что вы пытаетесь отправить пустые поля формы для имени пользователя или пароля, чтобы увидеть, как валидатор DataRequired останавливает процедуру отправки.

Создание простой формы с одним полем

Используя WTForms и модуль проверки для форм, давайте создадим простую форму с одним полем. Задаче требуется форма, содержащая одно поле, запрашивающее имя. Для начала создадим новый файл SingleInput.py и добавим следующий код:

После создания скрипта Python давайте создадим шаблон «form.html» для сохранения в каталоге «templates»:

Коды для form.html

Запустите код в командной строке с помощью python SingleInp.py и введите «http://127.0.0.1:5000 HD/form в вашем браузере.

Если вы введете Ben в качестве имени пользователя и отправите запрос, результат будет следующим:

После ввода имени страница отправляет приветственное сообщение с вашим именем.

Заключение

Очень полезно отслеживать прогресс, достигнутый пользователями, и использование форм во Flask. С использованием правильного расширения ваш опыт работы с Flask Website может стать намного лучше. Попрактиковавшись, вы сможете изучить другие методы проверки, расширения и приемы шаблонов, доступные в Flask. А пока давайте оставим это простым и сосредоточимся на следующей задаче. Простые блоки, такие как добавление Flask Forms, делают ваш сайт надежным и улучшают взаимодействие с пользователем.