Flask | Motor de plantillas Jinja2 | Desarrollo web con Python

Introducción

Generar HTML desde Python no es divertido y, de hecho, es bastante engorroso porque tienes que hacer la escapación HTML con escape por tu cuenta para mantener segura la aplicación. Debido a eso, Flask configura automáticamente el motor de plantillas Jinja2 para ti. Las plantillas se pueden utilizar para generar cualquier tipo de archivo de texto. Para aplicaciones web, en primer lugar estarás generando páginas HTML, pero también puedes generar markdown, texto plano para correos electrónicos y cualquier otra cosa.

En este laboratorio, aprenderemos a utilizar el motor de plantillas Jinja2 para generar plantillas seguras y dinámicas.

Skills Graph

%%%%{init: {'theme':'neutral'}}%%%% flowchart RL python(("Python")) -.-> python/ControlFlowGroup(["Control Flow"]) flask(("Flask")) -.-> flask/DevelopmentToolsGroup(["Development Tools"]) python(("Python")) -.-> python/ModulesandPackagesGroup(["Modules and Packages"]) python(("Python")) -.-> python/AdvancedTopicsGroup(["Advanced Topics"]) flask(("Flask")) -.-> flask/DataHandlingGroup(["Data Handling"]) flask(("Flask")) -.-> flask/CoreConceptsGroup(["Core Concepts"]) flask/DataHandlingGroup -.-> flask/response_objects("Response Objects") flask/CoreConceptsGroup -.-> flask/url_route_registrations("URL Route Registrations") python/ControlFlowGroup -.-> python/conditional_statements("Conditional Statements") flask/DevelopmentToolsGroup -.-> flask/template_rendering("Template Rendering") python/ModulesandPackagesGroup -.-> python/importing_modules("Importing Modules") python/AdvancedTopicsGroup -.-> python/decorators("Decorators") subgraph Lab Skills flask/response_objects -.-> lab-188849{{"Generando plantillas dinámicas y seguras con Jinja2"}} flask/url_route_registrations -.-> lab-188849{{"Generando plantillas dinámicas y seguras con Jinja2"}} python/conditional_statements -.-> lab-188849{{"Generando plantillas dinámicas y seguras con Jinja2"}} flask/template_rendering -.-> lab-188849{{"Generando plantillas dinámicas y seguras con Jinja2"}} python/importing_modules -.-> lab-188849{{"Generando plantillas dinámicas y seguras con Jinja2"}} python/decorators -.-> lab-188849{{"Generando plantillas dinámicas y seguras con Jinja2"}} end

Renderizar plantillas con Jinja2

En este paso, implementarás la renderización de plantillas con el motor de plantillas Jinja2.

Abre el archivo rendering_templates.py y primero importa la clase Flask y render_template. Luego crea una instancia de la clase Flask.

from flask import Flask, render_template
app = Flask(__name__)

A continuación, usamos el decorador route() para crear dos rutas, / y /<name>, para compartir una función de vista llamada hello. Para renderizar una plantilla, puedes usar el método render_template(). Está proporcionado por Flask para renderizar plantillas con el motor de plantillas Jinja2. Todo lo que tienes que hacer es proporcionar el nombre de la plantilla y las variables que quieres pasar al motor de plantillas como argumentos de palabras clave. En la función de vista, usamos el método render_template() para renderizar la plantilla hello.html con una variable llamada name.

@app.route('/')
@app.route('/<name>')
def hello(name=None):
    return render_template('hello.html', name=name)

Crear un punto de entrada main del script para iniciar la aplicación Flask en un puerto (por ejemplo, puerto = 5000). Luego habilitar el modo debug.

if __name__ == "__main__":
    app.run(host='0.0.0.0', port=5000, debug=True)

Flask buscará las plantillas en la carpeta templates por defecto. Entonces necesitamos crear una carpeta llamada templates y crear el archivo llamado hello.html bajo esa carpeta. Podemos crear la carpeta y el archivo necesarios ejecutando el siguiente comando en la terminal.

cd ~/project
mkdir templates
cd templates
touch hello.html

Abre el archivo templates/hello.html y escribe el siguiente código:

<!doctype html>
<title>Hello from Flask</title>
{% if name %}
<h1>Hello {{ name }}!</h1>
{% else %}
<h1>Hello, World!</h1>
{% endif %}

El código anterior utiliza el bloque condicional en Jinja2. Verifica si la variable name es verdadera (no es None o está vacía). Si es así, se mostrará el contenido Hello {{ name }}!. De lo contrario, se mostrará el contenido Hello, World!.

Para ejecutar la aplicación, primero usa los siguientes comandos para lanzar la aplicación Flask en la terminal:

cd ~/project
python3 rendering_templates.py

Luego abre la pestaña "Web 5000" ubicada en la parte superior de la interfaz y actualiza la interfaz. Y entonces deberías ver que la página muestra Hello, World!.

Para la ruta /<name>, puedes agregar un sufijo directamente en la barra de direcciones URL. Por ejemplo, a continuación se muestra un sufijo flask ingresado en la barra de direcciones URL con el puerto 5000, y muestra Hello, flask! como salida.

Flask route name example
Puedes probar diferentes rutas /<name> en la barra de direcciones URL, la salida también cambiará en consecuencia.

Resumen

En este laboratorio, aprendimos a renderizar nuestras plantillas utilizando el motor de plantillas Jinja2 mediante el método render_template(). Este método no solo renderiza las plantillas de manera nítida, sino que también habilita la escapación automática, lo que ayuda a prevenir posibles ataques XSS.