Menu

Šablona baňky, formulář, zobrazení a přesměrování s příklady

  • Hlavní
  • Jiný
  • Šablona baňky, formulář, zobrazení a přesměrování s příklady

flask template form

Vyzkoušejte Náš Nástroj Pro Odstranění Problémů

Tento výukový program vysvětluje, co jsou Šablona baňky, Formulář, Zobrazení, Odpověď a Přesměrování, s praktickými příklady:

Obecně se šablonování používá v programování k opětovnému použití části textu s různými daty. Pokud jde o vývoj webu, designéři používají šablony k zobrazení dat ve formě, která je čitelná a atraktivní pro lidské čtenáře.

Návrh šablony obecně zahrnuje použití jazyka kvůli složitosti, kterou představuje lidská interakce.

=> Zde se podívejte na průvodce pro začátečníky

Baňkové šablony, pohledy a formuláře

Co se naučíte:

Úvod

Flask používá šablonový stroj s názvem Jinja2, který zobrazuje chování aplikace na základě úrovně interakce uživatele. Šablona Jinja používá proměnné, výrazy a značky.

Proměnné a výrazy jsou během běhu před vykreslením stránky v prohlížeči nahrazeny hodnotami. Značky Jinja pomáhají při psaní logiky a řídících příkazů v šabloně Flask.

Pohled na baňku

Pojem zobrazení baňky je odvozen od převládajícího vzoru webové aplikace s názvem Model-View-Controller. Pohled je jedním ze tří vzájemně propojených prvků v tomto paradigmatu, kde se zabývá aplikační logikou. Pohled se postará o prezentaci informací Uživateli.

V našem předchozím kurzu jsme navrhli View podtřídou třídy BaseView Flask-Appbuilderu. V následující části tohoto tutoriálu rozšíříme náš poslední příklad a představíme způsoby, jak lze zobrazení přizpůsobit.

Šablona baňky

Začněme a vytvořme první šablonu. V adresáři šablon vytvořte soubor s názvem hello.html.

Napište následující kód do tohoto souboru a uložte jej.

Hello World!, from Software Testing Help.

{% for item in greetings %} {% if 'Morning' in item %}

{{item}}

{% else %}

{{item}}

{% endif %} {% endfor %}

Šablona pro smyčku

Ve výše uvedené šabloně baňky jsme použili smyčku for k iteraci na položky seznamu. V našem řadiči nebo obslužné rutině jsme do šablony předali seznam s hodnotami pozdravů. Uvnitř šablony přistupujeme ke každé položce pomocí syntaxe {{item}}.

Šablona, ​​pokud blok

Kromě toho si poznamenejte použití příkazu if. Zde otestujeme položku na Ráno a zvýrazníme ji tučně a kurzivou.

Nyní pojďme o krok vpřed, abychom se dozvěděli více o konceptech Flask Forms.

Formuláře baňky

Jedním z nejdůležitějších aspektů šablony je převzetí vstupů od uživatelů a zápis logiky back-endu na základě tohoto vstupu. Vytvořme formulář.

K vykreslení našeho formuláře používáme Flask-Appbuilder SimpleFormView. Nejprve si však vytvořme formulář. Kromě vytvoření formuláře musíme k vytvoření uživatele správce použít příkaz flask fab create-admin.

Proto před spuštěním vývojového serveru použijte příkaz, aby bylo možné následně vytvořené pohledy a formuláře ověřit pomocí přihlášeného uživatele. Přihlašujeme se pomocí administrátora a stále ověřujeme, že vytvořené pohledy jsou viditelné v nabídce, jak je znázorněno na screenshotech.

Vytvořit správce

Pomocí níže uvedeného příkazu vytvořte uživatele správce.

baňka fab create-admin

Přihlaste se pomocí přihlašovacích údajů správce

  • Po navigaci na http: // localhost: 8080 klikněte na Přihlásit.
Přihlaste se jako správce
Přihlaste se jako správce
  • Přihlaste se pomocí přihlašovacích údajů správce, vytvořených v předchozí části.
Klikněte na Přihlásit
Klikněte na Přihlásit se
  • Kliknutím na kategorii Moje formuláře získáte přístup ke svým názorům.
Klikněte na nabídku
Klikněte na nabídku

Poznámka: Poslední krok budete moci provést až po přidání pohledů do výchozí nabídky zobrazené na navigační liště.

Pojďme do toho a vytvořme několik formulářových pohledů.

Vytvořte soubor s názvem forms.py v adresáři aplikace a napište do něj následující kód.

from wtforms import Form, StringField from wtforms.validators import DataRequired from flask_appbuilder.fieldwidgets import BS3TextFieldWidget from flask_appbuilder.forms import DynamicForm class GreetingsForm(DynamicForm): greeting1 = StringField(('Morning'), description = ('Your morning Greeting'), validators = (DataRequired()), widget = BS3TextFieldWidget()) greeting2 = StringField(('Afternoon'), description = ('Your Afternoon Greeting'), validators = (DataRequired()), widget = BS3TextFieldWidget()) greeting3 = StringField(('Evening'), description = ('Your Evening Greeting'), widget = BS3TextFieldWidget()) greeting4 = StringField(('Night'), description = ('Your Night Greeting'), widget = BS3TextFieldWidget())

Vytvořili jsme formulář založený na DynamicForm z Flask-Appbuilder. Existují čtyři textová pole. Rozšiřujeme náš příklad pozdravů. Ze čtyř polí jsou dvě povinná a dvě volitelná, protože u prvních dvou pozdravů jsme uvedli hodnoty pro validátory.

Nyní vytvořme zobrazení pro tento formulář. Tyto následující řádky kódu zapište do souboru views.py.

from flask import render_template, flash from flask_appbuilder import SimpleFormView from app.forms import GreetingsForm class GreetingsView(SimpleFormView): form = GreetingsForm form_title = 'This is a Greetings form' message = 'Your Greetings are submitted' def form_get(self, form): form.greeting1.data = 'Your Morning Greeting' form.greeting2.data = 'Your Afternoon Greeting' form.greeting3.data = 'Your Evening Greeting' form.greeting4.data = 'Your Night Greeting' def form_post(self, form): flash(self.message, 'info') greetings = ( form.greeting1.data, form.greeting2.data, form.greeting3.data, form.greeting4.data, ) session('greetings')=greetings return redirect(url_for('HelloWorld.hello_greetings2'))

V našem pohledu výše máme dvě metody zvané form_get a form_post pro vyplnění výchozích hodnot v polích formulářů a čtení zadaných hodnot po odeslání formuláře z prohlížeče.

GreetingsView zobrazí formulář, jak je znázorněno na následujícím obrázku.

Zdravím formulář

Také používáme objekt relace Flask k ukládání hodnot pole v form_post, abychom k nim mohli přistupovat v odpovídajícím novém pohledu, který se chystáme napsat.

Pojďme nyní upravit třídu HelloWorld a přidat další metodu pro zobrazení pozdravů. Říkáme tomu hello_greetings2.

class HelloWorld(BaseView): ## other methods @expose('/greetings2') def hello_greetings2(self): greetings = session('greetings') return render_template('hello.html', greetings=greetings)

V tomto zobrazení načteme hodnoty z objektu relace a pomocí šablony vykreslení Flask zobrazíme tyto hodnoty v HTML orientovaném na uživatele. Všimněte si, že hello_greetings2 je alternativní způsob dosažení stejné funkce podobné hello_greetings.

Jediný rozdíl je v tom, že pomocí hello_greetings2 zobrazujeme hodnoty, které zadává uživatel, a v hello_greetings jsme od uživatele nepřijali žádné vstupy a při psaní pohledu mapovaného na příslušnou trasu jsme je pevně zakódovali.

Reakce baňky

Je poměrně vzácné, že v kódu najdete explicitní použití Flaskovy odpovědi. Třída Response v Flasku je jen podtřídou třídy Response ze třídy Werkzueg's Response, která zase podtřídy své třídy ResponseBase.

Objekt Flask Response je interně formován Flaskem, kdykoli zavoláme příkaz return nebo metodu, jako je render_template.

Dále můžeme přizpůsobit kód odezvy a typ obsahu, pokud je to požadováno jako součást návratového příkazu v našich zobrazeních, jak je znázorněno v upraveném zobrazení HelloWorld níže.

class HelloWorld(BaseView): ## other methods @expose('/greetings2') def hello_greetings2(self): greetings = session('greetings') return render_template('hello.json', greetings=greetings), 201, {'Content-Type' : 'application/json'

Přímé použití třídy Flask's Response lze zahrnout v případě použití, když streamujeme obsah namísto vracení celého obsahu najednou z důvodu omezení velikosti souboru a šířky pásma sítě.

Níže jsme ukázali jeden příklad streamování obsahu z velkého souboru CSV.

from flask import Response @app.route('https://cdn.softwaretestinghelp.com/largefile.csv') def send_large_csv(): '''A controller to stream the content of a large csv file''' def gen(): for row in iter_all_rows(): yield ','.join(row) + ' ' return Response(gen(), mimetype='text/csv')

Přesměrování baňky

Není vždy možné, aby aplikace předdefinovala odpověď na základě různých požadavků klienta.

Flask Redirect používáme ve scénářích, kde je možné poskytnout obsah, který lze splnit jinými pohledy nebo místy v reakci na požadavek. Používáme Flask Redirect spolu s abortem se standardními návratovými kódy HTTP.

Například, v níže uvedeném kódu jsme použili přesměrování s HTTP kódem 301 a přerušili jsme 401.

from flask import Flask, redirect, url_for, request, abort app = Flask(__name__) @app.route('/') def index(): return render_template('log_in.html') # Log In template @app.route('/login',methods = ('POST', 'GET')) def login(): if request.method == 'POST': if request.form('username') == 'admin' : # if user is admin return redirect(url_for('success')), 301 else: abort(401) # stop processing else: return redirect(url_for('index')) # redirect to another view

Dále zkontrolujte v GreetingsView, kde jsme využili Flask redirect a url_for k internímu přesměrování požadavku na jiné zobrazení uložením hodnot pozdravů v objektu relace. Přesměrování baňky vždy vrátí objekt odpovědi s výchozím nebo daným stavovým kódem do jiného umístění v aplikaci.

Baňka Debugtoolbar

Flaskův interaktivní debugger jsme již představili v našem posledním kurzu. V tomto kurzu provedeme ještě jeden krok k usnadnění ladění aplikace Flask. Po instalaci se panel nástrojů Flask Debug zobrazí jako překrytí nad aplikací Flask.

Nainstalujte panel nástrojů Flask Debug.

pip install flask-debugtoolbar

Chcete-li aktivovat debugtoolbar, otevřete v našem projektu soubor __init__.py a upravte kód přidáním následujících řádků kódu.

from flask_debugtoolbar import DebugToolbarExtension app.debug = True toolbar = DebugToolbarExtension(app)

Pamatujte, že panel nástrojů Flask debug je povolen pouze v režimu ladění. Jakmile je povoleno, při opětovném načtení aplikace budete sledovat dvě věci.

# 1) Panel nástrojů Debug se zobrazí na pravé straně prohlížeče. Kliknutím a rozbalením zobrazíte různé funkce poskytované panelem nástrojů.

Aktivace panelu nástrojů ladění
Aktivace panelu nástrojů ladění

#dva) Kdykoli je do aplikace odeslán nový požadavek POST, je zachycen panelem nástrojů, abychom mohli zkontrolovat proměnné a další parametry týkající se ladění aplikace.

Zachytit panel nástrojů ladění
Zachytit panel nástrojů ladění

Toto výchozí zachycení lze deaktivovat pomocí níže uvedené konfigurace.

app.config('DEBUG_TB_INTERCEPT_REDIRECTS') = False Výsledky testu Pytest
Ladit proměnné panelu nástrojů

Nyní napíšeme několik testů, které otestují naše pohledy na další funkce, které jsme zavedli v ukázkové aplikaci.

software pro umělou inteligenci zdarma pro PC

Před pokračováním v testování deaktivujte ladění, jak je uvedeno níže v __init__.py. Případně můžete komentovat níže uvedený řádek.

app.debug = False

Testování zobrazení aplikace baňky

Potřebujeme uspořádat testovací kód, aby byl lépe ovladatelný. Vytvořte soubor s názvem conftest.py v kořenovém adresáři a přesuňte níže uvedené řádky z test_hello.py do tohoto souboru.

from app import appbuilder import pytest @pytest.fixture def client(): ''' A pytest fixture for test client ''' appbuilder.app.config('TESTING') = True with appbuilder.app.test_client() as client: yield client

zařízení pytest jsou načítána programem pytest za běhu. Tato zařízení jsou k dispozici a jsou sdílena se všemi testy. Definování conftest.py v kořenové cestě libovolného projektu se považuje za osvědčený postup, protože pytest dokáže rozpoznat všechny moduly v projektu bez zadání explicitní PYTHONPATH.

Přidejte ještě jeden test pro soubor test_hello. Níže je uveden příklad testu. Voláme metodu get objektu klienta a prosazujeme očekávanou hodnotu v datech odpovědí uložených v resp. Datech.

Podobně můžete napsat více testů směřujících k různým pohledům. V dalších výukách napíšeme více testů.

def test_greetings(client): ''' A test method to test view hello_greetings''' resp = client.get('/hello/greetings', follow_redirects=True) assert b'Good Morning' in resp.data

Spusťte testy pomocí níže uvedeného příkazu z kořenového adresáře projektu.

pytest -v

Testovací běh produkuje výsledky testu v konzole, jak je uvedeno níže:

Selhání v pytestu
Výsledky testu Pytest

Zatím nejsou žádné poruchy. Pojďme si navrhnout ještě jeden test, jak je uvedeno níže.

def test_greetings2(client): ''' A test method to test view hello_greetings2 ''' resp = client.get('/hello/greetings2', follow_redirects=True) assert b'Good Morning' in resp.data

Tento test selže, protože jsme nedefinovali žádný atribut zprávy ve třídě HelloWorld v souboru views.py.

Jakmile spustíte testy pomocí pytest -v, zobrazí se na konzole znovu výsledky podobné obrázku níže.

Selhání v pytestu

V následující části jsou vysvětleny kroky, které musíme provést při provádění testů na platformě CI / CD. Pro stejný projekt používáme akce Git.

CI / CD s akcemi Git

Nyní uložíme všechny změny v souborech a vytvoříme potvrzení zadáním zprávy pro tento kurz. Po potvrzení v místním úložišti stáhneme změny ze vzdáleného původu pomocí příznaku –rebase, abychom zjistili, zda nedochází ke konfliktům s novými změnami na dálkovém ovladači. Vyměňujeme rebase, abychom udrželi konzistentní historii.

Pomocí níže uvedeného příkazu můžete stáhnout a sloučit změny ze vzdáleného počátku. Před provedením změn ze vzdáleného ovladače však proveďte změny.

git pull origin master --rebase

Nyní pokladna místní hlavní větev a sloučit s tutorial-2 větev. Jakmile je sloučení úspěšné, publikujte tyto změny v hlavním zdroji. Tato akce vyvolá sestavení na cílových platformách. Tento kód testujeme na Python3.7 a Python 3.8 na nejnovější verzi Ubuntu.

Závěr

V tomto kurzu jsme viděli, jak šablony fungují v rámci Flask. Nastínili jsme kroky vytváření a vykreslování šablon baňky s uživatelsky definovanými hodnotami pomocí proměnných a výrazů.

Viděli jsme také příklady předdefinovaného pohledu BaseView pluginu Flask Appbuilder. Toto zobrazení mohou vývojáři Flask snadno podtřídit a vytvořit vlastní zobrazení.

Dosud pokryté koncepty pomáhají čtenářům rychle vytvářet statické a dynamické webové stránky pomocí baňky bez databázového backendu. V dalším kurzu vysvětlíme, jak číst a zapisovat data z a do databází pomocí ModelView, když projdeme konceptem používání databází s bankou.

=> Přečtěte si sérii Easy Flask Training Series

Doporučené čtení

^