Flask WTF

Ein wichtiger Aspekt einer Webanwendung ist es, den Benutzern eine Benutzeroberfläche bereitzustellen. HTML bietet ein <form>-Tag, um eine Schnittstelle zu gestalten. Es können angemessene Formularelemente wie Texteingaben, Radiobuttons, Auswahlkästchen usw. verwendet werden.

Die Benutzerdaten werden durch GET- oder POST-Methode in Form einer HTTP-Anfragenachricht an das Server-Skript gesendet.

Das Server-Skript muss die Formularelemente neu erstellen, indem es Daten aus HTTP-Anfragen abruft. Daher müssen die Formularelemente praktisch zweimal definiert werden - Einmal ist HTML, einmal ist Server-Skript. Ein weiterer Nachteil der Verwendung von HTML-Formularen ist, dass es schwierig (wenn nicht unmöglich) ist, Formularelemente dynamisch darzustellen. HTML selbst kann die Eingaben des Benutzers nicht validieren.

Das ist WTForms, ein flexibles Formular, Rendering- und Validierungsbibliothek, die es einfach macht. Flask-Die WTF-Erweiterung bietet dem WTForms-Bibliothek eine einfache Schnittstelle.

Verwenden Sie Flask-WTF ermöglicht es, Formularfelder in Python-Skripten zu definieren und sie mit HTML-Templates darzustellen. Es kann auch Validierung auf den WTF-Feldern angewendet werden.

Lassen Sie uns nun sehen, wie die dynamische Generierung von HTML funktioniert.

Zunächst muss Flask installiert werden-WTF-Erweiterung.

#　Filename　:　example.py
#　Copyright　:　2020　By　w3codebox
#　Author　by　:　de.oldtoolbag.com
#　Date　:　2020-08-08
pip install flask-WTF

Der installierte Software-Paket enthält eine Form-Klasse, die als Elternteil der durch den Benutzer definierten Formulare verwendet werden muss. Das WTforms-Paket enthält Definitionen verschiedener Formularfelder. Nachfolgend sind einige Standardformularfelder aufgeführt.

Beispielsweise kann ein Formular mit Textfeldern gestaltet werden, wie folgt -

#　Filename　:　example.py
#　Copyright　:　2020　By　w3codebox
#　Author　by　:　de.oldtoolbag.com
#　Date　:　2020-08-08
from flask_wtf import Form
　von wtforms import TextField
　class ContactForm(Form):
　　　　　name = TextField("Name des Schülers")

Neben dem name-Feld wird auch ein verstecktes CSRF-Token-Feld automatisch erstellt. Dies dient dazu, Angriffe durch Cross-Site-Request-Forgery (CSRF) zu verhindern.

Bei der Darstellung wird ein äquivalenter HTML-Skript erzeugt, wie folgt.

#　Filename　:　example.py
#　Copyright　:　2020　By　w3codebox
#　Author　by　:　de.oldtoolbag.com
#　Date　:　2020-08-08
<input id="csrf_token" name="csrf_token" type="hidden">　/>
　<label for="name">Name des Schülers</label><br>
　<input id="name" name="name" type="text" value="">　/>

Benutzerdefinierte Formularklassen werden in Flask-Anwendungen verwendet, Formulare werden mit Templates dargestellt.

#　Filename　:　example.py
#　Copyright　:　2020　By　w3codebox
#　Author　by　:　de.oldtoolbag.com
#　Date　:　2020-08-08
von flask import Flask, render_template
　from　forms　import　ContactForm
　app　=　Flask(__name__)
　app.secret_key　=　'development　key'
　@app.route('/contact')
　def　contact():
　　　　　form　=　ContactForm()
　　　　　return　render_template('contact.html',　form　=　form)
　if　__name__　==　'__main__':
　　　　　app.run(debug　=　True)

Das WTForms-Paket enthält auch Validator-Klassen, die bei der Validierung von Formularfeldern sehr nützlich sind. Die folgende Liste zeigt die gebräuchlichsten Validator.

Das 'DataRequired'-Validierungsregeln wird auf das name-Feld des Kontaktformulars angewendet.

#　Filename　:　example.py
#　Copyright　:　2020　By　w3codebox
#　Author　by　:　de.oldtoolbag.com
#　Date　:　2020-08-08
name = TextField("Name des Schülers", [validators.Required("Bitte geben Sie Ihren Namen ein.")])

Die validate()-Funktion des Formularobjekts überprüft die Formulardaten und wirft bei fehlgeschlagener Überprüfung einen Überprüfungsfehler aus. Die Fehlermeldung wird an das Template gesendet. In HTML-Templates werden Fehlermeldungen dynamisch dargestellt.

#　Filename　:　example.py
#　Copyright　:　2020　By　w3codebox
#　Author　by　:　de.oldtoolbag.com
#　Date　:　2020-08-08
{%　for　message　in　form.name.errors　%}
　　　　{{ message }}
　{%　endfor　%}

Nachfolgender Beispiel zeigt die oben genannten Konzepte. Der Code für das Kontaktformular ist wie folgt ( forms.py)。

#　Filename　:　example.py
#　Copyright　:　2020　By　w3codebox
#　Author　by　:　de.oldtoolbag.com
#　Date　:　2020-08-08
from flask_wtf import Form
　from wtforms import TextField, IntegerField, TextAreaField, SubmitField, RadioField, SelectField
　from wtforms import validators, ValidationError
　class ContactForm(Form):
　　　　　name = TextField("Name des Schülers", [validators.Required("Bitte geben Sie Ihren Namen ein.")])
　　　　　Geschlecht = RadioField('Geschlecht', choices = [('M', 'Männlich'), ('F', 'Weiblich')])
　　　　　Adresse = TextAreaField("Adresse")
　　　　　email = TextField("E-Mail", [validators.Required("Bitte geben Sie Ihre E-Mail-Adresse ein.")]),
　　　　　　　validators.Email("Bitte geben Sie Ihre E-Mail-Adresse ein.")])
　　　　　Alter = IntegerField("Alter")
　　　　　language = SelectField('Sprache', choices = [('cpp', 'C'))++'), ('py', 'Python')])
　　　　　submit = SubmitField("提交")

Validator wird auf die Namens- und E-Mail-Felder angewendet. Nachfolgend ist der Flask-Anwendungsskript angegeben ( formexample.py)。

#　Filename　:　example.py
#　Copyright　:　2020　By　w3codebox
#　Author　by　:　de.oldtoolbag.com
#　Date　:　2020-08-08
from　flask　import　Flask,　render_template,　request,　flash
　from　forms　import　ContactForm
　app　=　Flask(__name__)
　app.secret_key　=　'development　key'
　@app.route('/contact',　methods　=　['GET',　'POST'])
　def　contact():
　　　　　form　=　ContactForm()
　　　　　if　request.method　==　'POST':
　　　　　　　　if　form.validate()　==　False:
　　　　　　　　　　　flash('All　fields　are　required.')
　　　　　　　　　　　return　render_template('contact.html',　form　=　form)
　　　　　　　　else:
　　　　　　　　　　　return　render_template('success.html')
　　　　　elif　request.method　==　'GET':
　　　　　　　　　　　return　render_template('contact.html',　form　=　form)
　if　__name__　==　'__main__':
　　　　　app.run(debug　=　True)

Template-Skript( contact.html) wie folgt -

#　Filename　:　example.py
#　Copyright　:　2020　By　w3codebox
#　Author　by　:　de.oldtoolbag.com
#　Date　:　2020-08-08
<html>
　<head>
　<meta　http-equiv="Content-Type"　content="text/html;　charset=utf-8-8"　/>
　<title>Flask-Beispiel</title>
　</head>
　　　　<body>
　　　　　　<h2　style　=　"text-align:　center;">Kontaktformular</h2>
　　　　　　　{%　for　message　in　form.name.errors　%}
　　　　　　　　　　<div>{{　message　}}</div>
　　　　　　　{%　endfor　%}
　　　　　　　{%　for　message　in　form.email.errors　%}
　　　　　　　　　　<div>{{　message　}}</div>
　　　　　　　{%　endfor　%}
　　　　　　　<form　action　=　"http://localhost:5000/contact"　method　=　post>
　　　　　　　　　　<fieldset>
　　　　　　　　　　　　　<legend>填写项</legend>
　　　　　　　　　　　　　{{　form.hidden_tag()　}}
　　　　　　　　　　　　　<div　style　=　font-size:20px;　font-weight:bold;　margin-left:150px;>
　　　　　　　　　　　　　　　　{{　form.name.label　}}<br>
　　　　　　　　　　　　　　　　{{　form.name　}}
　　　　　　　　　　　　　　　　<br>
　　　　　　　　　　　　　　　　{{　form.Gender.label　}}　{{　form.Gender　}}
　　　　　　　　　　　　　　　　{{　form.Address.label　}}<br>
　　　　　　　　　　　　　　　　{{　form.Address　}}
　　　　　　　　　　　　　　　　<br>
　　　　　　　　　　　　　　　　{{　form.email.label　}}<br>
　　　　　　　　　　　　　　　　{{　form.email　}}
　　　　　　　　　　　　　　　　<br>
　　　　　　　　　　　　　　　　{{　form.Age.label　}}<br>
　　　　　　　　　　　　　　　　{{　form.Age　}}
　　　　　　　　　　　　　　　　<br>
　　　　　　　　　　　　　　　　{{　form.language.label　}}<br>
　　　　　　　　　　　　　　　　{{　form.language　}}
　　　　　　　　　　　　　　　　<br>
　　　　　　　　　　　　　　　　{{　form.submit　}}
　　　　　　　　　　　　　</div>
　　　　　　　　　　</fieldset>
　　　　　　　</form>
　　　　</body>
　</html>

在Python shell中运行 formexample.py，并访问URL => http://localhost:5000/contact 。 联系人表单将显示如下。

如果有错误信息，页面将如下所示 -

如果没有错误，将呈现 success.html页面的内容，如下所示 -