Создание динамических HTML страниц с Python и Flask

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

Установка Flask


pip install Flask

Создание базового приложения

Для начала создадим базовое веб-приложение Flask. Создайте файл app.py и добавьте следующий код:


from flask import Flask

app = Flask(__name__)

@app.route('/')
def home():
    return 'Добро пожаловать на динамическую страницу!'

Здесь мы создаем экземпляр Flask и определяем маршрут /, который будет отображать приветственное сообщение.

Чтобы запустить приложение, выполните следующие команды в терминале:


set FLASK_APP=app.py
set FLASK_ENV=development

flask run

После этого ваше приложение будет доступно по адресу http://127.0.0.1:5000/.

Использование шаблонов Jinja2

Чтобы создать динамические страницы, мы будем использовать шаблоны Jinja2. Создайте папку templates в корневой директории вашего проекта. В этой папке мы будем хранить наши шаблоны HTML.

Передача данных в шаблон

Теперь давайте передадим данные из Python в HTML шаблон. Мы можем использовать функцию render_template из Flask.

Создайте файл hello.html в папке templates и добавьте в него следующий код:

<!DOCTYPE html>
<html>
<head>
    <title>Динамическая страница</title>
</head>
<body>
    <h1>Добро пожаловать, {{ name }}!</h1>
</body>
</html>

Теперь обновим наше приложение в app.py, чтобы передать имя в шаблон:

from flask import Flask, render_template

app = Flask(__name__)

@app.route('/')
def home():
    user_name = "Mihail"
    return render_template('hello.html', name=user_name)

Мы создали переменную user_name и передали ее в функцию render_template как name. Теперь, если вы посетите главную страницу вашего приложения, вы увидите приветствие «Добро пожаловать, Mihail!».

Получение данных от пользователя

Давайте сделаем нашу страницу более интерактивной, позволив пользователю вводить свое имя. Для этого мы можем использовать HTML форму.

Обновите hello.html следующим образом:

<!DOCTYPE html>
<html>
<head>
    <title>Динамическая страница</title>
</head>
<body>
    <h1>Добро пожаловать, {{ name }}!</h1>
    <form method="POST">
        <label for="name">Введите ваше имя:</label>
        <input type="text" id="name" name="name">
        <input type="submit" value="Отправить">
    </form>
</body>
</html>

Теперь обновим app.py, чтобы обрабатывать отправку формы:

from flask import Flask, render_template, request

app = Flask(__name__)

@app.route('/', methods=['GET', 'POST'])
def home():
    user_name = "Гость"

    if request.method == 'POST':
        user_name = request.form['name']

    return render_template('hello.html', name=user_name)

Мы добавили метод POST к маршруту /, чтобы обрабатывать отправку формы. Если пользователь отправляет форму, мы получаем имя из запроса и используем его для создания персонализированного приветствия.

Теперь, когда пользователь вводит свое имя в форму и отправляет ее, он увидит персонализированное приветствие на странице.

Заключение

Создание динамических страниц в Flask — это мощный способ сделать ваши веб-приложения более интересными и полезными для пользователей. Вы можете передавать данные из Python в HTML шаблоны и обрабатывать введенные пользователем данные, делая ваше приложение более интерактивным.

Источник