http://www.xavierdupre.fr/app/ensae_teaching_cs/helpsphinx/notebooks/TD2A_eco_debuter_flask.html

Qu'est-ce que c'est ?

Flask est un framework web léger pour Python. Son but est d'être souple et léger. Il utilise un système de templates et est sous licence BSD.

Première page

!/usr/bin/env python3
coding: utf-8

from flask import Flask

On initialise notre application, qui s'appellera donc "app".
__name__ renverra le script lui-même.

app = Flask(__name__)

On définit une route avec ce décorateur :
Notre code s'applique à la racine du site.

@app.route("/")

Voici la fonction décorée : elle s'éxecute à l'affichage de la route en question.

def hello():

   return "Hi there"

if __name__ == "__main__":

   #run() est la méthode qui lance notre app. Cela lance un serveur web sur le port 5000.
   app.run()

</syntaxhighlight>

Ici, le terme "route" fait référence à la dernière partie d'une URL, celle qui donne le chemin des fichiers : www.site.fr/undossier/unepage

Un peu de style

Pour l'instant, la page est très basique. Nous allons devoir donner à Flask une structure de dossiers qu'il comprendra, avec templates et des styles prédéfinis pour l'application. Voici un exemple:

<source> . ├── hello_world_green.py ├── static │ └── main.css └── templates

   └── home.html

</source>

hello_world_green.py est le script principal.
static contient une feuille de style main.css
templates contient une page html.

!/usr/bin/env python
-*- coding: utf-8 -*-

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

@app.route("/") def hello():

   return render_template("home.html", message = "Hello World!")
   #render_template fait le lien entre la page html, qui est un template, et le script en lui-même.
   #On voit que l'appel de fonction initialise la variable message, qui est une variable utilisateur (pas définie par Flask)

if __name__ == "__main__":

   app.run()

</syntaxhighlight>

<source lang="css">

static/main.css

h1 {

 font-size: 2em;
 color: green;
 text-align: center;

} </source>

<source lang="html">

/templates/home.html

<!doctype html> <html lang="en">

   <head>

   </head>
   <body>

Modèle:Message

#On reconnaît les variables à la Jinja2 !

   </body>

</html> </source> </nowiki>

Plusieurs pages

Tout ça c'est sympa, mais si on pouvait naviguer entre les pages ? Pour cela, il suffit de rajouter une route:

!/usr/bin/env python
-*- coding: utf-8 -*-

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

Première page

@app.route("/") def hello():

   return render_template("home.html", message_bienvenue = "Bienvenue sur la page d'accueil !")

Deuxième page

@app.route("/next") def suite():

   return render_template("page_suivante.html")

if __name__ == "__main__":

   app.run()

</syntaxhighlight>

Nous avons nos deux pages, qui contiennent des liens:

templates/home.html

<!doctype html> <html lang="en">

   <head>

   </head>
   <body>

Modèle:Message bienvenue

   </body>
       <a href="Modèle:Url for('suite')"> Cliquer pour continuer </a>

</html> </syntaxhighlight>

templates/home.html

<!doctype html> <html lang="en">

   <head>

   </head>
   <body>

Vous êtes sur la 2eme page

   </body>

<a href="Modèle:Url for('hello')"> retourner à la page d'accueil </a> </html></syntaxhighlight>

Ici, encore une fois, on voit bien les appels à la fonction intégrée à Flask "url_for", qui fait le lien avec les deux routes déclarées.

Des formulaires

Élément essentiel pour interagir avec un site web, les formulaires permettent au visiteur d'envoyer des informations. On repart sur une structure de dossier simple:

.
├── login.py
├── __pycache__
│   └── login.cpython-37.pyc
├── static
│   └── main.css
└── templates
    ├── bienvenue.html
    └── home.html

<syntaxhighlight lang='python'> from flask import Flask from flask import request from flask import render_template

app = Flask(__name__)

Notre page de base

@app.route('/') def home():

   return render_template("home.html")

Notre boîte de texte

@app.route('/', methods=['POST']) def text_box():

   #request contient toutes les données envoyées en POST
   #Sa méthode form permet de créer une boîte de dialogue;
   #Il s'agit d'un dictionnaire associant la valeur au champ name du formulaire (ici, "text")
   #On peut donc récupérer son contenu avec request.form["text"]
   text = request.form['text'] 
   processed_text = text.upper()
   return render_template("bienvenue.html" , message = processed_text )

if __name__ == '__main__':

   app.run()</syntaxhighlight>

home.html: <syntaxhighlight lang='html'> <!doctype html> <html lang="en">

 <head>

<body>

Indiquer votre nom

   <form action="." method="POST">
       <input type="text" name="text">
       <button type="submit">OK</button>
   </form>

</body> </html></syntaxhighlight>

bienvenue.html: <syntaxhighlight lang='html'> <!doctype html> <html lang="en">

   <head>

   </head>
   <body>

Bienvenue Modèle:Message

   </body>
   <a href="Modèle:Url for('home')"> Retourner à la page d'accueil </a>

</html></syntaxhighlight>

main.css: <syntaxhighlight lang='css'> h1 {

 font-size: 2em;
 color: green;
 text-align: left;

}

</syntaxhighlight>

Python : Flask

Sommaire

Qu'est-ce que c'est ?

Première page

Un peu de style

Modèle:Message

Plusieurs pages

Modèle:Message bienvenue

Vous êtes sur la 2eme page

Des formulaires

Indiquer votre nom

Bienvenue Modèle:Message

Menu de navigation