Kurz: Práce s webovou architekturou Flask v sadě Visual Studio

Tento článek je prvním krokem v třídílné sérii kurzů, která ukazuje, jak pracovat s Flaskem v sadě Visual Studio. Flask je jednoduchá architektura Pythonu pro webové aplikace, která poskytuje základy směrování adres URL a vykreslování stránek. Flask se nazývá "mikro", protože přímo neposkytuje funkce, jako je ověřování formulářů, abstrakce databáze, ověřování atd. Tyto funkce jsou místo toho poskytovány speciálními balíčky Pythonu, které se nazývají rozšíření Flask . Rozšíření se bezproblémově integrují s Flaskem, takže se zobrazují, jako by byla součástí samotného Flasku. Například Samotný Flask neposkytuje modul šablony stránky. Šablonování poskytuje rozšíření, jako je Jinja a Jade, jak je znázorněno v tomto kurzu.

V kroku 1 kurzu se naučíte:

• Vytvoření řešení sady Visual Studio a projektu Flask
• Prozkoumejte šablonový kód projektu a spusťte projekt.
• Vytvoření úložiště Git pro zachování změn projektu Flask
• Práce s ovládacími prvky zdrojového kódu Gitu
• Vytvoření virtuálního prostředí pro projekt Flask

Tento kurz se liší od Flask Quickstart. Dozvíte se více o Flasku a o tom, jak používat šablony projektů Flask k zajištění rozsáhlejšího výchozího bodu pro vaše projekty. Šablony automaticky nainstalují balíček Flask při vytváření projektu, zatímco rychlý start ukázal, jak balíček nainstalovat ručně.

Požadavky

• Visual Studio 2022 ve Windows s následujícími možnostmi vybranými v Instalačním programu sady Visual Studio:

  • Na kartě Úlohy vyberte možnost vývoj pro Python. Další informace najdete v tématu Instalace podpory Pythonu v sadě Visual Studio.

  • Na kartě Jednotlivé komponenty v části Nástroje kóduvyberte možnost Git pro Windows.

Šablony projektů Flask jsou součástí všech starších verzí nástrojů Python Tools pro Visual Studio. Podrobnosti šablony se můžou lišit od popisů v tomto kurzu.

Visual Studio pro Mac se nepodporuje. Další informace najdete v tématu Co se děje se sadou Visual Studio pro Mac? Visual Studio Code ve Windows, Mac a Linuxu dobře funguje s Pythonem prostřednictvím dostupných rozšíření.

Vytvoření řešení sady Visual Studio a projektu Flask

V kroku 1 tohoto kurzu vytvoříte jedno řešení sady Visual Studio, které bude obsahovat dva samostatné projekty Flask. Projekty vytvoříte pomocí různých šablon projektů Flask, které jsou součástí sady Visual Studio. Díky zachování projektů ve stejném řešení můžete snadno přepínat mezi různými soubory pro porovnání.

Pomocí tohoto postupu vytvořte řešení a webový projekt Flask:

1. V sadě Visual Studio vyberte Soubor>Nový>Projekt a vyhledejte "Flask". Pak vyberte šablonu prázdného webového projektu Flask a vyberte Další.

   

2. Konfigurace nového projektu a řešení:

   1. Nastavte Název projektu sady Visual Studio na BasicProject. Tento název se také používá pro projekt Flask.

   2. Zadejte umístění pro Visual Studio pro uložení řešení a projektu.

   3. Zrušte zaškrtnutí možnosti Umístit řešení a projekt do stejného adresáře.

   4. Nastavte název řešení na LearningFlask. Řešení slouží jako kontejner pro více projektů v této sérii kurzů.

3. Vyberte Vytvořit.

4. Po chvíli Visual Studio zobrazí výzvu , že byl zjištěn soubor specifikace balíčku Pythonu „requirements.txt“ v projektu „BasicProject“.:

   

   Dialogové okno označuje, že vybraná šablona obsahuje soubor requirements.txt, který můžete použít k vytvoření virtuálního prostředí pro projekt.

5. Vyberte možnost X vpravo pro zavření výzvy. Později v tomto kurzu vytvoříte virtuální prostředí a zajistíte, aby správa zdrojového kódu vyloučila prostředí. (Prostředí lze kdykoli vytvořit později ze souboru requirements.txt.)

Prozkoumání ovládacích prvků Gitu

V dalším postupu se seznámíte s podporou sady Visual Studio pro správu zdrojového kódu Gitu.

Důležitý

Ve verzi sady Visual Studio 2019 verze 16.8je prostředí správy verzí Gitu ve výchozím nastavení zapnuté. Pokud chcete získat další informace o porovnání s Team Explorerem, podívejte se na porovnání Gitu a Team Exploreru stránky.

Pokud ale chcete pokračovat v používání Team Exploreru v sadě Visual Studio 2019, přejděte na Tools>Options>Environment>Preview Features a potom přepněte Nové uživatelské prostředí Gitu zaškrtávací políčko. (Tato možnost není dostupná v sadě Visual Studio 2022 a novější.) Další informace naleznete v tématu Připojení k projektům v Team Exploreru.

1. Pokud chcete projekt potvrdit do místní správy zdrojového kódu, vyberte Přidat do správy zdrojového kódu v pravém dolním rohu hlavního okna sady Visual Studio a pak vyberte Git:

   

   Otevře se okno Vytvořit úložiště Git, kde můžete vytvořit a odeslat nové úložiště.

2. Po vytvoření úložiště se v hlavním okně sady Visual Studio zobrazí panel ovládacích prvků Git v pravém dolním rohu:

   

   Na panelu ovládacích prvků Gitu zleva doprava se zobrazuje počet odchozích a příchozích potvrzení (šipky #/#), počet nepotvrzených změn (tužka #), název aktuální větve a název aktuálního úložiště. Ovládací prvky Gitu jsou také k dispozici v nabídce Git na hlavním panelu nástrojů.

3. Na panelu ovládacích prvků Gitu vyberte změny (tužka #) pro otevření okna Git Changes. Můžete také vybrat Zobrazit>změny v Gitu (Ctrl+O, Ctrl+G):

   

   V tomto okně se zobrazí podrobnosti o všech nepotvrzených změnách, včetně odložených změn. Vzhledem k tomu, že nově vytvořený projekt je již potvrzen do správy zdrojového kódu automaticky, neuvidíte žádné čekající změny.

4. Na panelu ovládacích prvků Gitu vyberte potvrzení (šipky #/#) a pak vyberte Zobrazit všechna potvrzení:

   

   Otevře se okno úložiště Git . Můžete také vybrat Zobrazit>úložiště Git (Ctrl+O, Ctrl+R):

   

   Toto okno zobrazuje podrobnosti o aktuálním úložišti v levém podokně a aktuální větvi s odchozími a příchozími potvrzeními v pravém podokně.

   Pokud chcete zobrazit rozdíly v souboru, vyberte v prostředním podokně potvrzení. Předchozí verze se zobrazí na levé straně a revidovaná verze se zobrazí na pravé straně. Podrobnosti také obsahují autora změny, osobu provádějící změnu a zprávu o potvrzení.

Během práce v tomto kurzu si zvyknete pravidelně používat ovládací prvky Git v sadě Visual Studio k potvrzení a nasdílení změn. Tento kurz vám připomene v příslušných bodech.

Používejte správu zdrojového kódu od začátku

Použití správy zdrojového kódu od začátku projektu má několik výhod. Pokud používáte správu zdrojového kódu od začátku projektu, zejména pokud používáte také vzdálené úložiště, získáte pravidelné zálohování projektu mimo pracoviště. Na rozdíl od údržby projektu jen v místním systému souborů poskytuje správa zdrojového kódu úplnou historii změn a snadnou možnost vrátit jeden soubor nebo celý projekt do předchozího stavu. Historie změn pomáhá určit příčinu regresí (selhání testů).

Správa zdrojového kódu je nezbytná, pokud na projektu pracuje více lidí, protože spravuje přepsání a zajišťuje řešení konfliktů. Správa zdrojového kódu je v podstatě formou automatizace, která vám pomůže automatizovat sestavování, testování a správu verzí. Jedná se o první krok při používání Azure DevOps pro projekt, a protože překážky vstupu jsou tak nízké, neexistuje žádný důvod k tomu, abyste od začátku nepoužívali správu zdrojového kódu.

Další informace o správě zdrojového kódu jako automatizaci najdete v tématu Zdroj pravdy: Role úložišť v DevOps, článek v MSDN Magazine napsaný pro mobilní aplikace, které platí také pro webové aplikace.

Zabránění automatickému potvrzení projektů ve Visual Studio

Pokud chcete zabránit automatickému uložení nového projektu ve Visual Studio, postupujte takto:

1. Vyberte Nástroje>Možnosti>Řízení verzí>Globální nastavení Gitu.

2. Zrušte ve výchozím nastavení možnost Potvrdit změny po sloučení a vyberte OK.

Vytvoření virtuálního prostředí a vyloučení správy zdrojového kódu

Po konfiguraci správy zdrojového kódu pro projekt můžete vytvořit virtuální prostředí s potřebnými balíčky Flask, které projekt vyžaduje. Potom můžete pomocí okna Git Changes vyloučit složku prostředí ze správy zdrojového kódu.

1. V Průzkumníku řešeníklikněte pravým tlačítkem na uzel Python prostředí a vyberte Přidat prostředí.

   

2. V dialogovém okně Přidat prostředí vyberte Vytvořit pro přijetí výchozích hodnot. (Pokud chcete, můžete změnit název virtuálního prostředí, což změní název její podsložky, ale env je standardní konvence.)

   

3. Pokud visual Studio vyzve k zadání oprávnění správce, zadejte svůj souhlas. Počkejte několik minut, než Visual Studio stáhne a nainstaluje balíčky. U Flasku a jejích závislostí může proces vyžadovat rozšíření téměř 1 000 souborů ve více než 100 podsložkách. Průběh můžete zobrazit v okně výstupu sady Visual Studio.

4. Na panelu ovládacích prvků Git vyberte nepotvrzené změny (které se teď zobrazují 99+), aby se otevřelo okno Git Changes:

   

   Vytvoření virtuálního prostředí přináší tisíce změn, ale nemusíte je zahrnout do správy zdrojového kódu. Vy nebo kdokoli jiný, kdo projekt klonuje, můžete prostředí kdykoli znovu vytvořit pomocí souboru requirements.txt.

5. Pokud chcete virtuální prostředí vyloučit ze správy zdrojového kódu, klikněte v okně Git Changes pravým tlačítkem na složku env a vyberte Ignorovat tyto místní položky:

   

   Po vyloučení virtuálního prostředí jsou jedinými zbývajícími změnami souboru projektu (.py) a souboru .gitignore, který obsahuje přidanou položku pro složku virtuálního prostředí.

   Pokud chcete zobrazit zobrazení rozdílů pro soubor .gitignore, poklikejte na soubor v okně změny Gitu.

6. V okně Git Changes zadejte zprávu potvrzení, například Počáteční změny projektu:

   

7. V rozevírací nabídce Commit vyberte Commit Staged a Push.

Můžete otevřít okno úložiště Git a potvrdit, že se fázovaná potvrzení zobrazí v místní historie pro aktuální větev.

Vysvětlení účelu virtuálních prostředí

Virtuální prostředí je skvělý způsob, jak izolovat přesné závislosti vaší aplikace. Tato metoda izolace zabraňuje konfliktům v globálním prostředí Pythonu a pomáhá jak testování, tak spolupráci. V průběhu času při vývoji aplikace vždy přinášíte mnoho užitečných balíčků Pythonu. Díky zachování balíčků ve virtuálním prostředí specifickém pro projekt můžete snadno aktualizovat soubor requirements.txt projektu, který popisuje toto prostředí, které je součástí správy zdrojového kódu. Když projekt zkopírujete do jiných počítačů, včetně buildových serverů, serverů nasazení a dalších vývojových počítačů, je snadné prostředí znovu vytvořit. Prostředí můžete znovu vytvořit jenom pomocí souboru requirements.txt, což je důvod, proč prostředí nemusí být ve správě zdrojového kódu. Další informace naleznete v tématu Použití virtuálních prostředí.

Odstranit virtuální prostředí pod správou zdrojového kódu

Virtuální prostředí můžete odebrat, až bude pod správou zdrojového kódu. Postupujte takto:

1. Pokud chcete složku vyloučit, upravte soubor .gitignore:

   1. Otevřete soubor tak, že vyberete Soubor>Otevřít>Soubor.

      Soubor můžete otevřít také z Team Exploreru. Na stránce Nastavení vyberte Nastavení úložiště. Přejděte do části Ignorovat soubory atributů & a vyberte odkaz Upravit vedle .gitignore.

   2. Vyhledejte oddíl na konci, který obsahuje komentář # Python Tools for Visual Studio (PTVS).

   3. Za touto částí přidejte nový řádek pro složku virtuálního prostředí, například /BasicProject/env.

2. Otevřete příkazové okno a přejděte do složky (například BasicProject), která obsahuje složku virtuálního prostředí, například env.

3. Spuštěním příkazu git rm -r env odeberte virtuální prostředí, které je aktuálně pod správou zdrojového kódu.

4. Potvrďte změny příkazem git commit -m 'Remove venv' nebo je potvrďte ze stránky ZměnyTeam Exploreru.

Prozkoumejte šablonový kód

V této části prozkoumáte šablonový kód v souboru projektu (.py), který Visual Studio vytvoří na základě vaší volby šablony.

1. Otevřete Průzkumníka řešení a zobrazte soubory řešení a projektu. Počáteční projekt obsahuje pouze dva soubory, app.py a requirements.txt:

   

   Soubor requirements.txt určuje závislosti balíčku Flask. Přítomnost tohoto souboru vás při prvním vytvoření projektu vyzve k vytvoření virtuálního prostředí.

   Jeden soubor app.py obsahuje předpřipravený kód pro prázdný Flask webový projekt.

2. Otevřete soubor app.py v editoru a prozkoumejte první část, příkaz import pro Flask.

   Tento příkaz vytvoří instanci třídy Flask, která je přiřazena proměnné app. Tato část také přiřadí proměnnou wsgi_app (což je užitečné při nasazení na webového hostitele, ale zatím se nepoužívá):

   from flask import Flask
   app = Flask(__name__)
   
   # Make the WSGI interface available at the top level so wfastcgi can get it.
   wsgi_app = app.wsgi_app
   

3. Druhá část, která se má zkontrolovat, se provádí na konci souboru. Tato část obsahuje volitelný kód, který můžete použít ke spuštění vývojového serveru Flask.

   Kód můžete definovat tak, aby používal konkrétní hodnoty hostitele a portu převzaté z proměnných prostředí, nebo použít výchozí hodnotu hostitele a portu localhost:55551.

   if __name__ == '__main__':
       import os
       HOST = os.environ.get('SERVER_HOST', 'localhost')
       try:
           PORT = int(os.environ.get('SERVER_PORT', '5555'))
       except ValueError:
           PORT = 5555
       app.run(HOST, PORT)
   

4. Třetí část kódu pro prozkoumání přiřadí funkci ke směrování adresy URL, což znamená, že funkce poskytuje prostředek identifikovaný adresou URL.

   Trasy definujete pomocí dekorátoru Flasku @app.route s argumentem, který představuje relativní URL cestu od kořenového adresáře webu. Jak vidíte v kódu, funkce vrátí pouze textový řetězec, který postačuje pro to, aby jej prohlížeč zobrazil. V dalších krocích v této sérii návodů aktualizujete kód tak, aby vykreslovaly bohatší stránky pomocí HTML.

   @app.route('/')
   def hello():
       """Renders a sample page."""
       return "Hello World!"
   

Pochopte argument názvu ve třídě Flask

Argument name ve třídě Flask je název modulu nebo balíčku aplikace. Flask používá název k určení, kde hledat šablony, statické soubory a další prostředky, které patří do aplikace. U aplikací obsažených v jednom modulu je __name__ vždy správnou hodnotou. Název je také důležitý pro doplňky, které potřebují informace o odlaďování. Další informace a další argumenty najdete v dokumentaci třídy Flask (flask.pocoo.org).

Použijte více dekorátorů tras

Funkce může mít více než jeden dekorační prvek pro trasu. Můžete použít libovolný počet dekorátorů, pokud stejná funkce obsluhuje více tras. Pokud chcete například použít funkci hello pro trasu / i trasu /hello, použijte následující kód:

@app.route('/')
@app.route('/hello')
def hello():
    """Renders a sample page."""
    return "Hello World!"

Použití proměnných tras URL a parametrů dotazu

Flask může pracovat s trasami adres URL proměnných a parametry dotazu. V trase označíte libovolnou proměnnou atributem <variable_name>. Flask předá proměnnou funkci pomocí pojmenovaného argumentu v cestě URL. Například trasa ve formě /hello/<name> vygeneruje řetězcový argument s názvem name do funkce. Parametry dotazu jsou k dispozici prostřednictvím vlastnosti request.args, konkrétně prostřednictvím request.args.get metody. Následující kód obsahuje příklad:

# URL: /hello/<name>?message=Have%20a%20nice%20day
@app.route('/hello/<name>')
def hello(name):
    msg = request.args.get('message','')
    return "Hello " + name + "! "+ msg + "."

Chcete-li změnit typ, přidejte předponu k proměnné pomocí int, float, path (která přijímá lomítka k určení názvů složek) a uuid. Viz Pravidla proměnných v dokumentaci k Flasku pro více informací.

Generování požadavků po instalaci balíčku

Visual Studio může po instalaci dalších balíčků vygenerovat soubor requirements.txt z virtuálního prostředí.

• V Průzkumníku řešenírozbalte uzel prostředí Pythonu, klikněte pravým tlačítkem na virtuální prostředí a vyberte Generovat requirements.txt.

Při úpravách prostředí je vhodné tento příkaz pravidelně používat. Potvrďte změny do souboru requirements.txt do správy zdrojového kódu spolu s dalšími změnami kódu, které závisí na daném prostředí. Pokud nastavíte kontinuální integraci na buildovém serveru, měli byste soubor vygenerovat a potvrdit změny při každé úpravě prostředí.

Spusťte projekt

Teď jste připraveni spustit projekt v sadě Visual Studio pomocí tohoto postupu:

1. V sadě Visual Studio vyberte Ladění>Spustit ladění (F5) nebo na hlavním panelu nástrojů vyberte Webový server (prohlížeč, který vidíte, se může lišit):

   

2. Oba příkazy přiřadí proměnné prostředí PORT náhodné číslo portu a spustí Python soubor app.py.

   Kód spustí aplikaci pomocí daného portu na vývojovém serveru Flask.

   Pokud Visual Studio zobrazí zprávu Nepodařilo se spustit ladicí program a indikuje, že nebyl nalezen žádný spouštěcí soubor, klikněte pravým tlačítkem myši na soubor app.py v Průzkumníku řešení a vyberte Nastavit jako spouštěcí soubor.

3. Po spuštění serveru se otevře okno konzoly pro zobrazení protokolu serveru. Visual Studio automaticky otevře prohlížeč pro http://localhost:<port>, kde by se měla zobrazit zpráva vykreslená funkcí hello:

   

4. Až budete hotovi, zavřete okno konzoly, které zastaví vývojový server Flask. Můžete také zvolit Ladění>Zastavit ladění.

Porovnejte ladicí příkazy s příkazy Pythonu projektu

Mezi použitím příkazů z nabídky Debug a příkazy serveru uvedenými v podnabídce Python je rozdíl.

Kromě příkazů nabídky Ladění a tlačítek na panelu nástrojů můžete server spustit také pomocí příkazů Python>Spustit server nebo Python>Spustit ladicí server v místní nabídce projektu.

Oba příkazy otevřou okno konzoly, ve kterém vidíte místní adresu URL (localhost:port) pro spuštěný server. Musíte ale ručně otevřít prohlížeč s danou adresou URL a spuštění ladicího serveru nespustí ladicí program sady Visual Studio automaticky. Ladicí program můžete připojit ke spuštěnému procesu později, pokud chcete, pomocí příkazu Debug>Připojit k procesu.

Další krok

Krok 2: Vytvoření aplikace Flask se zobrazeními a šablonami stránek