Samouczek: rozpoczynanie pracy z platformą internetową platformy Flask w programie Visual Studio

Platforma Flask to uproszczona struktura języka Python dla aplikacji internetowych, która udostępnia podstawowe informacje na potrzeby routingu adresów URL i renderowania stron.

Platforma Flask jest nazywana strukturą "mikro", ponieważ nie zapewnia bezpośrednio funkcji, takich jak walidacja formularzy, abstrakcja bazy danych, uwierzytelnianie itd. Takie funkcje są zamiast tego udostępniane przez specjalne pakiety języka Python nazywane rozszerzeniami platformy Flask. Rozszerzenia są bezproblemowo integrowane z platformą Flask, aby wyglądały tak, jakby były częścią samej platformy Flask. Na przykład sama platforma Flask nie udostępnia aparatu szablonu strony. Tworzenie szablonów jest dostarczane przez rozszerzenia, takie jak Jinja i Jade, jak pokazano w tym samouczku.

Z tego samouczka dowiesz się, jak wykonywać następujące czynności:

• Utwórz podstawowy projekt platformy Flask w repozytorium Git przy użyciu szablonu "Blank Flask Web Project" (krok 1).
• Utwórz aplikację platformy Flask z jedną stroną i renderuj ją przy użyciu szablonu (krok 2).
• Obsługa plików statycznych, dodawanie stron i używanie dziedziczenia szablonu (krok 3).
• Użyj szablonu projektu internetowego platformy Flask, aby utworzyć aplikację z wieloma stronami i dynamicznym projektem (krok 4).

W trakcie tych kroków utworzysz pojedyncze rozwiązanie programu Visual Studio, które zawiera dwa oddzielne projekty. Projekt jest tworzony przy użyciu różnych szablonów projektów platformy Flask, które są dołączone do programu Visual Studio. Zachowując projekty w tym samym rozwiązaniu, można łatwo przełączać się między różnymi plikami w celu porównania.

Uwaga

Ten samouczek różni się od przewodnika Szybki start platformy Flask, w którym dowiesz się więcej o platformie Flask, a także o tym, jak używać różnych szablonów projektów platformy Flask, które zapewniają bardziej rozbudowany punkt wyjścia dla własnych projektów. Na przykład szablony projektów automatycznie instalują pakiet Platformy Flask podczas tworzenia projektu, zamiast ręcznie instalować pakiet, jak pokazano w przewodniku Szybki start.

Wymagania wstępne

• Program Visual Studio 2022 w systemie Windows z następującymi opcjami:
  • Obciążenie programowania w języku Python (karta Obciążenie w instalatorze). Aby uzyskać instrukcje, zobacz Instalowanie obsługi języka Python w programie Visual Studio.
  • Usługa Git dla systemu Windows na karcie Poszczególne składniki w obszarze Narzędzia kodu.

Szablony projektów platformy Flask są dołączone do wszystkich wcześniejszych wersji narzędzi Python Tools for Visual Studio, ale szczegóły mogą się różnić od omówionych w tym samouczku.

Programowanie w języku Python nie jest obecnie obsługiwane w Visual Studio dla komputerów Mac. Na komputerach Mac i Linux użyj rozszerzenia języka Python w programie Visual Studio Code — samouczek.

Krok 1–1. Tworzenie projektu i rozwiązania programu Visual Studio

1. W programie Visual Studio wybierz pozycję Plik>nowy>projekt i wyszukaj frazę "Flask". Następnie wybierz szablon Blank Flask Web Project (Pusty projekt internetowy platformy Flask) i wybierz przycisk Next (Dalej).

   

2. Skonfiguruj nowy projekt, wprowadzając następujące informacje, a następnie wybierz pozycję Utwórz:

   • Nazwa: ustaw nazwę projektu programu Visual Studio na BasicProject. Ta nazwa jest również używana dla projektu Platformy Flask.
   • Lokalizacja: określ lokalizację, w której ma zostać utworzone rozwiązanie i projekt programu Visual Studio.
   • Nazwa rozwiązania: ustaw wartość Edukacja Flask, która jest odpowiednia dla rozwiązania jako kontenera dla wielu projektów w tym samouczku.

Krok 1–2. Badanie kontrolek Git i publikowanie w repozytorium zdalnym

W tym kroku zapoznasz się z kontrolkami Git programu Visual Studio i oknem Programu Team Explorer , w którym pracujesz z kontrolą źródła.

1. Aby zatwierdzić projekt w lokalnej kontroli źródła, wybierz polecenie Dodaj do kontroli źródła w dolnym rogu okna głównego programu Visual Studio i wybierz opcję Git. Ta akcja powoduje przejście do okna Tworzenie repozytorium Git, w którym można utworzyć i wypchnąć nowe repozytorium.

   

2. Po utworzeniu repozytorium w dolnej części zostanie wyświetlony zestaw nowych kontrolek Git. Od lewej do prawej te kontrolki pokazują niezauszane zatwierdzenia, niezatwierdzone zmiany, gałąź bieżącą i nazwę repozytorium:

   

3. Wybierz przycisk Zmiany usługi Git, a program Visual Studio otwiera okno Programu Team Explorer na stronie Zmiany usługi Git. Ponieważ nowo utworzony projekt jest już zatwierdzony do kontroli źródła automatycznie, nie widzisz żadnych oczekujących zmian.

   

4. Na pasku stanu programu Visual Studio wybierz przycisk niezauszanych zatwierdzeń (strzałka w górę z 2), aby otworzyć stronę Synchronizacja w programie Team Explorer. Ponieważ masz tylko repozytorium lokalne, strona udostępnia łatwe opcje publikowania repozytorium w różnych repozytoriach zdalnych.

   

   Możesz wybrać dowolną usługę dla własnych projektów. W tym samouczku przedstawiono użycie usługi GitHub, w której ukończony przykładowy kod samouczka jest przechowywany w repozytorium Microsoft/python-sample-vs-learning-django .

5. Po wybraniu dowolnego z kontrolek Publikuj program Team Explorer wyświetli monit o podanie dodatkowych informacji. Na przykład podczas publikowania przykładu na potrzeby tego samouczka najpierw trzeba było utworzyć samo repozytorium. W tym przypadku opcja Wypychanie do repozytorium zdalnego została użyta z adresem URL repozytorium.

   

   Jeśli nie masz istniejącego repozytorium, opcje Publikuj w usłudze GitHub i Wypychanie do usługi Azure DevOps umożliwiają utworzenie go bezpośrednio z poziomu programu Visual Studio.

6. Podczas pracy z tym samouczkiem możesz okresowo korzystać z kontrolek w programie Visual Studio w celu zatwierdzania i wypychania zmian. Ten samouczek przypomina o odpowiednich punktach.

Napiwek

Aby szybko poruszać się w programie Team Explorer, wybierz nagłówek (który odczytuje zmiany lub wypchnij na powyższych obrazach), aby wyświetlić menu podręczne dostępnych stron.

Pytanie: Jakie są pewne zalety korzystania z kontroli źródła od początku projektu?

Odpowiedź: Korzystanie z kontroli źródła od początku, zwłaszcza jeśli używasz również repozytorium zdalnego, zapewnia regularną kopię zapasową poza siedzibą projektu. W przeciwieństwie do obsługi projektu tylko w lokalnym systemie plików, kontrola źródła zapewnia również pełną historię zmian i łatwą możliwość przywracania pojedynczego pliku lub całego projektu do poprzedniego stanu. Ta historia zmian pomaga określić przyczynę regresji (awarie testów). Kontrola źródła jest niezbędna, jeśli wiele osób pracuje nad projektem, ponieważ zarządza zastąpieniem i zapewnia rozwiązanie konfliktów. Kontrola źródła jest zasadniczo formą automatyzacji, umożliwia zautomatyzowanie kompilacji, testowania i zarządzania wydaniami. Jest to pierwszy krok w korzystaniu z metodyki DevOps dla projektu, a ponieważ bariery wejścia są tak niskie, naprawdę nie ma powodu, aby nie używać kontroli źródła od początku.

Aby uzyskać dalszą dyskusję na temat kontroli źródła jako automatyzacji, zobacz The Source of Truth: The Role of Repositories in DevOps (Źródło prawdy: rola repozytoriów w metodyce DevOps), artykuł w magazynie MSDN Magazine napisany dla aplikacji mobilnych, które mają zastosowanie również do aplikacji internetowych.

Pytanie: Czy mogę uniemożliwić programowi Visual Studio automatyczne zatwierdzanie nowego projektu?

Odpowiedź: Tak. Aby wyłączyć automatyczne zatwierdzanie, przejdź do strony Ustawienia w programie Team Explorer, wybierz pozycję Ustawienia globalne usługi Git>, wyczyść opcję Zatwierdź zmiany po scaleniu domyślnie, a następnie wybierz pozycję Aktualizuj.

Krok 1–3. Tworzenie środowiska wirtualnego i wykluczanie go z kontroli źródła

Po skonfigurowaniu kontroli źródła dla projektu możesz utworzyć środowisko wirtualne z wymaganymi pakietami platformy Flask. Następnie możesz użyć programu Team Explorer , aby wykluczyć folder środowiska z kontroli źródła.

1. W Eksplorator rozwiązań kliknij prawym przyciskiem myszy węzeł Środowiska języka Python i wybierz polecenie Dodaj środowisko.

   

2. Wybierz pozycję Utwórz , aby zaakceptować wartości domyślne w oknie dialogowym Dodawanie środowiska wirtualnego. (Możesz zmienić nazwę środowiska wirtualnego, jeśli chcesz, co po prostu zmienia nazwę jego podfolderu, ale env jest konwencją standardową).

   

3. Jeśli zostanie wyświetlony monit o zgodę na uprawnienia administratora, poczekaj kilka minut, a program Visual Studio pobierze i zainstaluje pakiety. W tym czasie kilka tysięcy plików jest przesyłanych do tylu podfolderów! Postęp można zobaczyć w oknie Dane wyjściowe programu Visual Studio. Podczas oczekiwania zastanów się nad poniższymi sekcjami Pytania.

4. Na kontrolkach Git programu Visual Studio (na pasku stanu) wybierz wskaźnik zmian (który pokazuje wartość 99*), który otwiera stronę Zmiany w programie Team Explorer.

   Tworzenie środowiska wirtualnego wprowadzonych w tysiącach zmian, ale nie trzeba dołączać ich do kontroli źródła, ponieważ użytkownik (lub ktokolwiek inny klonowanie projektu) zawsze może odtworzyć środowisko z pliku requirements.txt.

   Aby wykluczyć środowisko wirtualne, kliknij prawym przyciskiem myszy folder env i wybierz polecenie Ignoruj te elementy lokalne.

   

5. Po wykluczeniu środowiska wirtualnego jedynymi pozostałymi zmianami są pliki projektu i plik gitignore. Plik .gitignore zawiera dodany wpis dla folderu środowiska wirtualnego. Możesz kliknąć dwukrotnie plik, aby zobaczyć różnice.

6. Wprowadź komunikat zatwierdzenia i wybierz przycisk Zatwierdź wszystko , a następnie wypchnij zatwierdzenia do repozytorium zdalnego.

Pytanie: Dlaczego chcę utworzyć środowisko wirtualne?

Odpowiedź: Środowisko wirtualne to doskonały sposób na izolowanie dokładnych zależności aplikacji. Taka izolacja pozwala uniknąć konfliktów w globalnym środowisku języka Python i ułatwia testowanie i współpracę. Wraz z upływem czasu podczas tworzenia aplikacji niezmiennie wprowadzasz wiele przydatnych pakietów języka Python. Dzięki przechowywaniu pakietów w środowisku wirtualnym specyficznym dla projektu można łatwo zaktualizować plik requirements.txt projektu, który opisuje to środowisko, które jest zawarte w kontroli źródła. Gdy projekt jest kopiowany do innych komputerów, w tym serwerów kompilacji, serwerów wdrażania i innych komputerów programistycznych, można łatwo odtworzyć środowisko przy użyciu tylko pliku requirements.txt (dlatego środowisko nie musi być w kontroli źródła). Aby uzyskać więcej informacji, zobacz Używanie środowisk wirtualnych.

Pytanie: Jak mogę usunąć środowisko wirtualne, które zostało już zatwierdzone do kontroli źródła?

Odpowiedź: Najpierw zmodyfikuj plik .gitignore , aby wykluczyć folder: znajdź sekcję na końcu z komentarzem # Python Tools for Visual Studio (PTVS) i dodaj nowy wiersz folderu środowiska wirtualnego, na przykład /BasicProject/env. (Ponieważ program Visual Studio nie wyświetla pliku w pliku Eksplorator rozwiązań otwórz go bezpośrednio za pomocą >polecenia menu Otwórz>plik. Możesz również otworzyć plik z programu Team Explorer: na stronie Ustawienia wybierz pozycję Repozytorium Ustawienia, przejdź do sekcji Ignoruj i atrybuty Pliki, a następnie wybierz link Edytuj obok pliku gitignore.

Następnie otwórz okno polecenia, przejdź do folderu, takiego jak BasicProject , który zawiera folder środowiska wirtualnego, taki jak env, i uruchom polecenie git rm -r env. Następnie zatwierdź te zmiany z wiersza polecenia (git commit -m 'Remove venv') lub zatwierdź je na stronie Zmiany w programie Team Explorer.

Krok 1–4. Badanie kodu kociołowego

1. Po zakończeniu tworzenia projektu zobaczysz rozwiązanie i projekt w Eksplorator rozwiązań, gdzie projekt zawiera tylko dwa pliki, app.py i requirements.txt:

   

2. Jak wspomniano wcześniej, plik requirements.txt określa zależność pakietu Platformy Flask. Obecność tego pliku jest tym, co zaprasza do utworzenia środowiska wirtualnego podczas pierwszego tworzenia projektu.

3. Pojedynczy plik app.py zawiera trzy części. Najpierw jest to import instrukcja dla platformy Flask, tworząc wystąpienie Flask klasy, które jest przypisane do zmiennej app, a następnie przypisywanie wsgi_app zmiennej (która jest przydatna podczas wdrażania na hoście internetowym, ale nie jest na razie używana):

   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
   

4. Druga część, na końcu pliku, to nieco opcjonalny kod, który uruchamia serwer deweloperski Platformy Flask z określonymi wartościami hosta i portu pobranymi ze zmiennych środowiskowych (domyślnie localhost:5555):

   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)
   

5. Trzeci to krótki fragment kodu, który przypisuje funkcję do trasy adresu URL, co oznacza, że funkcja udostępnia zasób zidentyfikowany przez adres URL. Trasy są definiowane przy użyciu dekoratora platformy @app.route Flask, którego argumentem jest względny adres URL z katalogu głównego witryny. Jak widać w kodzie, funkcja zwraca tylko ciąg tekstowy, który wystarczy do renderowania przeglądarki. W kolejnych krokach renderujesz bogatsze strony przy użyciu języka HTML.

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

Pytanie: Jaki jest cel argumentu nazwy klasy Flask?

Odpowiedź: Argumentem jest nazwa modułu lub pakietu aplikacji i informuje platformę Flask, gdzie szukać szablonów, plików statycznych i innych zasobów należących do aplikacji. W przypadku aplikacji zawartych w jednym module __name__ zawsze jest właściwą wartością. Ważne jest również, aby rozszerzenia wymagały informacji o debugowaniu. Aby uzyskać więcej informacji i dodatkowych argumentów, zobacz dokumentację klasy platformy Flask (flask.pocoo.org).

Pytanie: Czy funkcja może mieć więcej niż jeden dekorator tras?

Odpowiedź: Tak, możesz użyć jak najwięcej dekoratorów, jeśli ta sama funkcja obsługuje wiele tras. Aby na przykład użyć hello funkcji zarówno dla "/" jak i "/hello", użyj następującego kodu:

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

Pytanie: Jak platforma Flask działa ze zmiennymi trasami adresów URL i parametrami zapytania?

Odpowiedź: W trasie oznaczasz dowolną zmienną za <variable_name>pomocą elementu , a platforma Flask przekazuje zmienną do funkcji przy użyciu nazwanego argumentu w ścieżce adresu URL. Na przykład trasa w postaci /hello/<name> generuje argument ciągu wywoływany name do funkcji. Parametry zapytania są dostępne za pośrednictwem właściwości, w szczególności za pośrednictwem request.argsrequest.args.get metody .

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

Aby zmienić typ, przedrostek zmiennej za pomocą intzmiennej , floatpath (która akceptuje ukośniki w celu określenia nazw folderów) i uuid. Aby uzyskać szczegółowe informacje, zobacz Reguły zmiennych w dokumentacji platformy Flask.

Pytanie: Czy program Visual Studio może wygenerować plik requirements.txt ze środowiska wirtualnego po zainstalowaniu innych pakietów?

Odpowiedź: Tak. Rozwiń węzeł Środowiska języka Python, kliknij prawym przyciskiem myszy środowisko wirtualne, a następnie wybierz polecenie Generate requirements.txt (Generuj wymagania.txt). Warto używać tego polecenia okresowo podczas modyfikowania środowiska i zatwierdzania zmian w pliku requirements.txt do kontroli źródła wraz z innymi zmianami kodu, które zależą od tego środowiska. W przypadku skonfigurowania ciągłej integracji na serwerze kompilacji należy wygenerować plik i zatwierdzić zmiany za każdym razem, gdy zmodyfikujesz środowisko.

Krok 1–5. Uruchamianie projektu

1. W programie Visual Studio wybierz pozycję Debuguj>rozpocznij debugowanie (F5) lub użyj przycisku Serwer internetowy na pasku narzędzi (widoczna przeglądarka może się różnić):

   

2. Albo polecenie przypisuje losowy numer portu do zmiennej środowiskowej PORT, a następnie uruchamia polecenie python app.py. Kod uruchamia aplikację przy użyciu tego portu na serwerze deweloperskim platformy Flask. Jeśli w programie Visual Studio jest wyświetlany komunikat Nie można uruchomić debugera z komunikatem o braku pliku uruchamiania, kliknij prawym przyciskiem myszy app.py w Eksplorator rozwiązań i wybierz polecenie Ustaw jako plik startowy.

3. Po uruchomieniu serwera zostanie otwarte okno konsoli, w którym zostanie wyświetlony dziennik serwera. Program Visual Studio automatycznie otwiera przeglądarkę w lokalizacji http://localhost:<port>, w której powinien zostać wyświetlony komunikat renderowany przez hello funkcję:

   

4. Gdy skończysz, zatrzymaj serwer, zamykając okno konsoli lub używając polecenia Debuguj>zatrzymaj debugowanie w programie Visual Studio.

Pytanie: Jaka jest różnica między używaniem poleceń menu Debugowanie a poleceniami serwera w podmenu języka Python projektu?

Odpowiedź: Oprócz poleceń menu Debugowanie i przycisków paska narzędzi można również uruchomić serwer przy użyciu polecenia Uruchom serwer python>lub Uruchom serwer debugowania języka Python>w menu kontekstowym projektu. Oba polecenia otwierają okno konsoli, w którym zostanie wyświetlony lokalny adres URL (localhost:port) dla uruchomionego serwera. Należy jednak ręcznie otworzyć przeglądarkę z tym adresem URL, a uruchomienie serwera debugowania nie powoduje automatycznego uruchomienia debugera programu Visual Studio. Jeśli chcesz, możesz dołączyć debuger do uruchomionego procesu, używając polecenia Dołączanie debugowania>do procesu.

Następne kroki

W tym momencie podstawowy projekt platformy Flask zawiera kod startowy i kod strony w tym samym pliku. Najlepiej oddzielić te dwa problemy, a także oddzielić kod HTML i dane przy użyciu szablonów.

Tworzenie aplikacji platformy Flask z widokami i szablonami stron