Мега-Учебник Flask, Часть 1: «Привет, Мир!»
Это первая статья в серии, где я буду документировать мой опыт написания веб-приложения на Python, используя микрофреймворк Flask.
Моя предыстория
Приложение
Приложение, которое я собираюсь разрабатывать как часть этого руководства, является сервером микроблогов, и я решил назвать его microblog. Довольно креативно, я знаю.
Во время нашего прогресса я затрону следующие темы:
- Управление пользователями, включая управление входами, сессиями, ролями пользователя, профилями и пользовательскими аватарами
- Управление базой данных, включая миграцию
- Поддержка форм, включая валидацию полей
- Пагинация длинных списков элементов
- Полнотекстовый поиск
- E-mail уведомления пользователей
- HTML шаблоны
- Поддержка нескольких языков
- Кеширование и другая оптимизация производительности
- Методы отладки для серверов разработки и продакшна
- Установка на продакшн сервер
Как видите, я весьма значительно берусь за все это. Надеюсь, что это приложение, когда я его закончу, станет чем-то вроде шаблона для написания других веб-приложений.
Требования
Если ваш компьютер поддерживает Python 2.6/2.7, то все, вероятно, пойдет хорошо. Приложение из руководства должно нормально работать на Windows, OS X и Linux.
Это руководство подразумевает, что вы знакомы с окном терминала (командной консолью в случае Windows), и вы знаете основные команды для работы с файлами вашей ОС. Если это не так, то перед тем как продолжить, я рекомендую вам ознакомиться с тем, как создавать директории, копировать файлы и т.д., используя консоль.
Наконец, вы должны чувствовать себя свободно в написании кода на Python. Знакомство с модулями и пакетами этого языка также не помешает.
Установка Flask
Ну что ж, приступим!
Если у вас еще не установлен Python 2.7, то берем его отсюда.
Теперь нам нужно установить Flask и несколько расширений, которые мы будем использовать. Я предпочитаю создание виртуального окружения, где все это будет установлено таким образом, что ваша основная установка Python затронута не будет. В качестве бонуса, вам не нужен будет root доступ для установки таким способом.
Итак, открываем терминал, выбираем место, где будет ваше приложение, и создаем новую папку, в которой оно будет содержаться. Назовем эту папку microblog .
Далее скачиваем virtualenv.py и кладем его внутрь новой папки.
Чтобы создать новое окружение введите следующую команду:
Эта команда создаст полноценное окружение Python внутри папки flask
Виртуальные окружения могут быть активированы и деактивированы по желанию. Активированное окружение добавляет путь своей папки bin в path системы, например, когда вы вызываете интерпретатор python, то получаете версию текущего окружения, а не системную. Лично я никогда не любил это свойство, поэтому ни разу не активировал ни одно из моих окружений, вместо этого я просто вызывал тот интерпретатор, который хотел, печатая его путь.
Прим. пер.: Перед тем как вы начнете вводить команды, хочу отметить, что в комментариях к девятой части отметится баг в flask-whooshalchemy, исправленную версию можнонужно скачать отсюда (репозиторий автора)
Если вы пользователь Linux, OS x или Cygwin, установите flask и расширения, вводя следующие команды одну за одной:
Эти команды скачают и установят все пакеты, которые мы будем использовать в нашем приложении.
Учтите, что мы собираемся использовать Flask 0.9, а не последнюю версию. Flask 0.10 не было довольно долго и некоторые расширения не готовы для работы с данной версией. Также есть несколько несовместимостей между пакетами и последней версией pip , которые решены использованием конкретных версий для установки.
Windows пользователей ждет еще один шаг. Наблюдательный читаель заметит, что в списке команд для Windows отсутствует flask-mail . Это расширение не устанавливается чисто на Windows, поэтому мы пойдем обходным путем:
Я не буду вдаваться в подробности, поэтому если вы хотите узнать больше, прочтите документацию к flask-mail.
Если установка всех пакетов прошла успешно, вы можете удалить virtualenv.py , поскольку файл нам больше не понадобится.
«Hello, World!» в Flask
Теперь у вас есть подпапка flask , в вашей папке microblog , содержащая интерпретатор Python и фреймворк Flask с расширениями, которые мы будем использовать в этом приложении. Настало время написать наше первое веб-приложение!
После того как вы переместились папку microblog , давайте создадим основную структуру папок для нашего приложения:
В папку app мы поместим само наше приложение. Подпапка static нужна для хранения статики, такой как картинки, javascript файлы и таблицы стилей. Подпапка templates , очевидно, предназначена для хранения наших шаблонов.
Давайте начнем с создания простого скрипта инициализации нашего пакета app (файл app/__init__.py )
Скрипт выше просто создает объект приложения (наследуя Flask ), затем импортирует модуль представлений, который мы еще не написали.
Представления — это обработчики, которые отвечают на запросы веб-браузера. Представления в Flask пишутся как Python функции. Каждая функция представления сопоставляется с одним или несколькими запросами URL.
Напишем нашу первую функцию представления (файл app/views.py )
Это весьма простое представление, которое просто возвращает строку для отображения в пользовательском браузере. Два декоратора route создают привязку адресов / и /index к этой функции.
Последним шагом для получения полностью работающего веб-приложения будет создание скрипта, который стартует веб-сервер нашего приложения. Давайте назовем скрипт run.py и положим его в корневой каталог ( microblog/ ):
Скрипт просто импортирует переменную app из нашего пакета app и вызывает метод run для того, чтобы запустить сервер. Помните, что переменная app — экземпляр класса Flask , мы создали его выше.
Для запуска вашего приложения просто запустите скрипт. На OS X, Linux и Cygwin вам следует пометить файл исполняемым перед тем как вы сможете его запустить.
Тогда скрипт может быть вызван просто:
В Windows процесс немного отличается. Нет необходимости помечать файл исполняемым. Вместо этого вам нужно запустить скрипт как аргумент интерпретатора Python:
После старта сервер будет прослушивать порт 5000, ожидая соединений. Теперь откроем браузер и введем следующий URL в адресную строку:
Или же вы можете использовать эту ссылку:
Теперь вы увидели маршрутизацию в действии? Первый URL привязан к / , в то время как второй к /index . Оба маршрута ассоциированы с нашей функцией представления, поэтому они дают одинаковый результат. Если вы введете любой другой маршрут, то получите ошибку, так как только эти два были привязаны к функции представления.
Когда вы закончите играть с сервером вы можете просто нажать Ctrl-C, чтобы остановить его.
И этим я хочу закончить первую часть этого руководства.
Те из вас, кто поленился печатать, могут скачать код из этого руководства ниже:
Обратите внимание, что вам нужно установить Flask, чтобы запустить приложение из архива выше.
Что дальше
В следующей части серии мы изменим наше маленькое приложение для использования HTML шаблонов.
Создание веб-приложения с использованием Python Flask и MySQL
В этой серии мы будем использовать Python, Flask и MySQL для создания простого веб-приложения с нуля. Это будет приложение списка дел, в котором пользователи смогут зарегистрироваться, подписаться и создать свой список желаний.
Предполагается, что у вас есть базовые знания языка программирования Python . Мы будем использовать Flask , инфраструктуру веб-приложений Python для создания приложения и MySQL как сервер.
Введение в Python Flask
Flask — это фреймворк Python для создания веб-приложений. С официального сайта,
Когда мы думаем о Python, первое, что приходит нам в голову, — это Django framework. Но с точки зрения новичка в Python, начинать с Flask легче, чем с Django.
Установка Flask
Установить Flask легко и просто. С менеджером пакетов pip нужно сделать только:
Когда вы закончите установку Flask, создайте папку FlaskApp . Перейдите в папку FlaskApp и создайте файл с именем app.py . Импортируйте модуль flask и создайте приложение с помощью Flask, как показано ниже:
Теперь определим основной путь / и соответствующий ему обработчик запросов:
Затем проверьте, является ли исполняемый файл главной программой и запустите приложение:
Сохраните изменения и выполните app.py :
Укажите браузеру на http://localhost:5000/ и у вас должно появиться приветственное сообщение.
Создание домашней страницы
Во-первых, при запуске приложения мы должны показать домашнюю страницу с последними элементами списка дел, добавленными пользователями. Итак, добавим нашу домашнюю страницу в папку приложения.
Flask ищет файлы шаблонов внутри папки templates . Перейдите в папку PythonApp и создайте папку под названием templates . Внутри templates создайте файл index.html . Откройте index.html и пропишите следующий HTML:
Откройте app.py и импортируйте render_template , который мы будем использовать для рендеринга файлов шаблонов.
Измените основной метод, чтобы вернуть созданный файл шаблона.
Сохраните изменения и перезапустите сервер. Указав браузеру http://localhost:5000/ вы увидите следующее:
Создание страницы регистрации
Шаг 1. Настройка базы данных
Мы будем использовать MySQL в качестве сервера. Войдите в MySQL из командной строки или, если вы предпочитаете GUI, например, MySQL work bench, тоже можете пользоваться. Сначала создайте базу данных BucketList . Из командной строки:
Введите требуемый пароль и при входе в систему выполните следующую команду для создания базы данных:
Как только база данных будет создана, создайте таблицу tbl_user , как показано ниже:
Мы будем использовать Stored procedures в приложении Python для взаимодействия с базой данных MySQL. Поскольку таблица tbl_user была создана, создайте процедуру сохранения под названием sp_createUser , чтобы зарегистрировать пользователя.
При создании этой процедуры в таблице tbl_user сначала нужно проверить, не существует ли пользователь с тем же именем username . Если существует, нам нужно выдать ошибку, иначе мы создадим пользователя в таблице user. Вот как должна выглядеть процедура sp_createUser :
Шаг 2. Создание интерфейса регистрации
Перейдите в каталог PythonApp/templates и создайте файл HTML с именем signup.html . Добавьте следующий код HTML в signup.html :
Добавьте такой CSS как signup.css в постоянную папку внутри PythonApp .
В app.py добавьте метод showSignUp для отображения страницы регистрации после поступления запроса в /showSignUp :
Сохраните изменения и перезапустите сервер. Нажмите кнопку Sign Up на главной странице и у вас должна получиться такая страница регистрации:
Шаг 3. Внедрение метода регистрации
Затем нам нужен server-side метод для UI взаимодействия с базой данных MySQL. Перейдите в PythonApp и откройте app.py . Создайте новый метод signUp , а также добавьте /signUp . Так это выглядит:
Мы будем использовать jQuery AJAX для публикации данных регистрации в методе signUp , поэтому укажем метод в определении маршрута.
Чтобы прочитать опубликованные значения, нам нужно импортировать request из Flask.
С помощью request мы прочитаем значения, как показано ниже:
Как только значения прочитаны, мы проверяем, верны ли они, а пока давайте вернём простое сообщение:
Импортируйте json из Flask, так как мы используем его для возвращения данных json .
Шаг 4. Создание запроса на регистрацию
Мы будем использовать jQuery AJAX для отправки запроса на регистрацию в метод Python. Загрузите jQuery , разместите его внутри PythonApp/static/js и добавьте ссылку на него со страницы регистрации. Как только jQuery будет включен, мы добавим запрос POST JQuery при нажатии кнопки Sign Up .
Итак, давайте присоединим событие нажатия кнопки, как показано:
Сохраните изменения и перезапустите сервер. На странице Sign Up заполните данные и нажмите Sign Up. Проверьте браузер, у вас должно получиться следующее сообщение:
Шаг 5: вызов хранимой процедуры MySQL
У нас есть name , email address и password , мы вызываем процедуру MySQL для создания нового пользователя.
Чтобы соединиться с MySQL, мы будем использовать Flask-MySQL, который является расширением Flask. Чтобы начать работу с Flask-MySQL , установите его с помощью менеджера пакетов pip :
Импортируйте MySQL внутрь app.py :
Ранее мы определили наше приложение:
Наряду с этим, включая следующие конфигурации MySQL:
Сначала давайте создадим соединение MySQL:
Когда соединение установлено, нам понадобится cursor для запроса stored процедуры. Через conn соединение создаём курсор.
Перед вызовом stored процедуры, давайте сделаем надёжный пароль с помощником от Werkzeug. Импортируйте модуль в app.py :
Используйте модуль для создания хэшированного пароля.
Теперь вызываем процедуру sp_createUser :
Если процедура выполнена успешно, мы зафиксируем изменения и вернем сообщение об успешном завершении.
Сохраните изменения и перезапустите сервер. На странице регистрации введите name , email address и password и нажмите кнопку Sign Up. После успешного создания пользователя вы увидите сообщение в консоли браузера.
Подводя итоги
В этом уроке мы рассмотрели начало работы по созданию приложения с помощью Python Flask , MySQL и расширения Flask-MySQL . Мы создали и прописали таблицы базы данных, stored процедуру, а также обеспечили функциональность регистрации. В следующем уроке мы перейдём на уровень выше, реализовав функции входа в систему и некоторые ещё.
Как добавить готовый svg элемент на страницу?
Вопрос такой – для чего предназначены атрибуты xmlns, xmlns:xlink, и обязательно ли их указывать? Насколько я понимаю, через эти атрибуты нельзя добавить готовый svg элемент на страницу сайта. Каким атрибутом можно это сделать (хочу добавить svg как "встроенный")
<img svg+xml;. можно, как и другие картинки.
Всё ещё ищете ответ? Посмотрите другие вопросы с метками html css или задайте свой вопрос.
Site design / logo © 2022 Stack Exchange Inc; user contributions licensed under cc by-sa. rev 2022.6.10.42345
Нажимая «Принять все файлы cookie», вы соглашаетесь, что Stack Exchange может хранить файлы cookie на вашем устройстве и раскрывать информацию в соответствии с нашей Политикой в отношении файлов cookie.