教程：在 Visual Studio 中開始使用 Flask Web 框架

時間 2020-05-21

標籤教程 visual studio 開始使用 flask web 框架欄目 Visual Studio 简体版

原文原文鏈接

教程：在 Visual Studio 中開始使用 Flask Web 框架

Flask 是一種輕量級 Web 應用程序 Python 框架，爲 URL 路由和頁面呈現提供基礎知識。python

Flask 被稱爲「微」框架，由於它不直接提供窗體驗證、數據庫抽象、身份驗證等功能。此類功能改成由名爲 Flask 擴展的特殊 Python 包提供。這些擴展無縫集成 Flask，因此看起來就像 Flask 自己的一部分。例如，Flask 自己不提供頁模板引擎。 Jinja、Jade 等擴展提供模板化，如本教程所示。git

在本教程中，你將瞭解：github

使用「空白 Flask Web 項目」模板在 Git 存儲庫中建立一個基本 Flask 項目（步驟 1）
使用模板建立一個單頁 Flask 應用，並呈現該頁面（步驟 2）
爲靜態文件提供服務、添加頁面和使用模板繼承（步驟 3）
使用 Flask Web 項目模板建立包含多個頁面和響應式設計的應用（步驟 4）
使用「投票 Flask Web 項目」模板建立使用多種存儲選項（Azure 存儲、MongoDB 或內存）的投票應用。

在這些步驟的過程當中，將建立一個包含三個單獨項目的 Visual Studio 解決方案。使用 Visual Studio 中包含的不一樣 Flask 項目模板建立項目。經過將項目保留在同一解決方案中，能夠輕鬆地在不一樣文件之間來回切換以進行比較。數據庫

備註json

本教程與 Flask 快速入門的區別在於，能夠更詳細地瞭解 Flask 並瞭解如何使用不一樣的 Flask 項目模板（爲本身的項目提供更全面的起點）。例如，建立項目時，項目模板自動安裝 Flask 包，而無需按快速入門所示手動安裝包。flask

系統必備

Windows 上的 Visual Studio 2017 有如下選項：
- 「Python 開發」工做負載（安裝程序中的「工做負載」選項卡）。有關說明，請參閱在 Visual Studio 中安裝 Python 支持。
- 「代碼工具」下「單個組件」選項卡上的「適用於 Windows 的 Git」和「適用於 Visual Studio 的 GitHub 擴展」。

針對 Visual Studio 的 Python 工具的全部早期版本都附帶 Flask 項目模板，雖然詳細信息可能與本教程提供的信息有所出入。api

Visual Studio for Mac 當前不支持 Python 開發。在 Mac 和 Linux 上，使用 Visual Studio Code 中的 Python 擴展。瀏覽器

步驟 1-1：建立 Visual Studio 項目和解決方案

在 Visual Studio 中，選擇「文件」 > 「新建」 > 「項目」，搜索「Flask」，而後選擇「空白 Flask Web 項目」模板。（還能夠在左側列表的「Python」 > 「Web」中找到模板。）服務器
在對話框底部的字段中，輸入如下信息（如上圖所示），而後選擇「肯定」：併發
- 名稱：將 Visual Studio 項目的名稱設置爲「BasicProject」。此名稱還用於 Flask 項目。
- 位置：指定要在其中建立 Visual Studio 解決方案和項目的位置。
- 解決方案名稱：設置爲「LearningFlask」，適用於本教程中做爲多個項目的容器的解決方案。
- 建立解決方案的目錄：保留設置（默認值）。
- 新建 Git 存儲庫：選擇此選項（默認狀況下會清除該選項），以便在 Visual Studio 建立解決方案時建立本地 Git 存儲庫。若是未看到此選項，請運行 Visual Studio 2017 安裝程序並在「代碼工具」下的「單個組件」選項卡上添加「適用於 Windows 的 Git」和「適用於 Visual Studio 的 GitHub 擴展」。
稍後 Visual Studio 會顯示一個對話框，提示「此項目須要外部包」（以下所示）。顯示此對話框是由於該模板包含引用最新 Flask 1.x 包的 requirements.txt 文件。（選擇「顯示所需包」查看確切的依賴項。）
選擇選項「我將自行安裝」。當即建立虛擬環境，確保它會從源代碼管理中排除。（始終可從 requirements.txt 建立該環境。）

步驟 1-2：檢查 Git 控件併發布到遠程存儲庫

因爲選擇了「新建項目」對話框中的「建立新的 Git 存儲庫」，在建立過程完成後，項目就已經提交到本地源代碼管理。在此步驟中，你將熟悉 Visual Studio 的 Git 控件和在其中使用源代碼管理的「團隊資源管理器」窗口。

在 Visual Studio 主窗口下角處檢查 Git 控件。這些控件從左到右依次顯示未推送的提交、未提交的更改、存儲庫的名稱以及當前分支：

備註

若是未選擇「新建項目」對話框中的」建立新 Git 存儲庫「，Git 控件將僅顯示用於建立本地存儲庫的」添加到源代碼管理「命令。
選擇「更改」按鈕，Visual Studio 會在「更改」頁上打開「團隊資源管理器」窗口。因爲新建立的項目已經自動提交給源代碼管理，所以，看不到任何掛起的更改。
在 Visual Studio 狀態欄中，選擇「未推送的提交」按鈕（標有「2」的向上箭頭）以打開團隊資源管理器中的「同步」頁。因爲你只有一個本地存儲庫，頁面將提供簡單的選項將存儲庫發佈到不一樣的遠程存儲庫。

能夠爲本身的項目選擇任何所需的服務。本教程演示瞭如何使用 GitHub，其中本教程已完成的示例代碼保存在 Microsoft/python-sample-vs-learning-flask 存儲庫中。
選擇任一「發佈」控件時，「團隊資源管理器」都將提示你輸入詳細信息。例如，在發佈本教程的示例時，必須首先建立存儲庫自己，在這種狀況下，「推送到遠程存儲庫」選項將與存儲庫的 URL 結合使用。

若是沒有現有存儲庫，可經過「發佈到 GitHub」和「推送到 Azure DevOps」選項直接從 Visual Studio 建立一個存儲庫。
按照本教程執行操做時，請養成按期在 Visual Studio 中使用控件提交和推送更改的習慣。本教程會在適當時機提醒你。

提示

要在團隊資源管理器中快速導航，請選擇標頭（上圖中顯示爲「更改」或「推送」）來查看可用頁面的彈出菜單。

問：從項目一開始就使用源代碼管理有什麼好處？

答：首先，從一開始就使用源代碼管理，特別是若是同時還使用遠程存儲庫，就能夠提供項目的常規異地備份。與在本地文件系統上維護項目不一樣，源代碼管理還提供了完整的更改歷史記錄，用戶能夠輕鬆地將單個文件或整個項目還原到之前的狀態。此更改歷史記錄有助於肯定迴歸的緣由（測試失敗）。此外，若是多我的員執行一個項目，則源代碼管理必不可少，由於它管理重寫並提供衝突解決方案。最後，源代碼管理從根本上來講是一種自動化形式，它爲自動化構建、測試和發佈管理提供充分準備。這其實是將 DevOps 用於項目的第一步，並且因爲入門門檻很是低，所以沒有理由不從一開始就使用源代碼管理。

有關源控制做爲自動化的進一步討論，請參閱真相的來源：DevOps 中存儲庫的做用，這是 MSDN 雜誌中爲移動應用編寫的一篇文章，也適用於 Web 應用。

問：我可否阻止 Visual Studio 自動提交新項目？

答：能夠。若要禁用自動提交，請轉到「團隊資源管理器」中的「設置」頁，選擇「Git」 > 「全局設置」，清除標記爲「合併後默認提交更改」的選項，而後選擇「更新」。

步驟 1-3：建立虛擬環境並從源代碼管理中將其排除

你已爲項目配置源代碼管理，如今能夠建立包含項目必需 Flask 包的虛擬環境。而後，可使用「團隊資源管理器」從源代碼管理中排除環境文件夾。

在「解決方案資源管理器」中，右鍵單擊「Python 環境」節點並選擇「添加虛擬環境」。
隨即出現「添加虛擬環境」對話框，並顯示一條消息，指示「已找到 requirements.txt 文件。」此消息表示 Visual Studio 使用該文件來配置虛擬環境。
選擇「建立」以接受默認設置。（若是你願意，能夠更改虛擬環境名稱，這隻會更改其子文件夾的名稱，但 env 是標準約定。）
若是收到提示，贊成管理員權限，而後在 Visual Studio 下載和安裝包時耐心等待幾分鐘，對於 Flask 及其依賴項來講，這意味着在超過 100 的子文件夾中展開大約一千個文件。能夠在 Visual Studio「輸出」窗口中查看進度。在等待時，仔細考慮下面的「問題」部分。還能夠在 Flask 安裝頁 (flask.pcocoo.org) 上查看 Flask 依賴項的描述。
在 Visual Studio Git 控件（位於狀態欄上）上，選擇更改指示器（顯示「99*」），這將打開團隊資源管理器中的「更改」頁。

建立虛擬環境帶來了數百項更改，但不須要在源代碼管理中包含其中任何一項，由於你（或克隆項目的任何人員）始終可從 requirements.txt 從新建立環境。

要排除虛擬環境，請右鍵單擊 env 文件夾，而後選擇「忽略這些本地項」。
排除虛擬環境後，剩下的惟一更改是針對項目文件和 .gitignore。 .gitignore 文件包含虛擬環境文件夾的附加條目。能夠雙擊文件查看差別。
輸入提交消息，而後選擇「所有提交」按鈕，根據須要將提交推送到遠程存儲庫。

問：爲何須要建立虛擬環境？

答：虛擬環境是隔離應用確切依賴項的好辦法。此類隔離避免了全局 Python 環境中的衝突，有助於進行測試和協做。隨着時間的推移，在開發應用時，老是會引入許多有用的 Python 包。經過將包保存在特定於項目的虛擬環境中，能夠輕鬆更新項目中介紹該環境的 requirements.txt 文件，該文件包含在源代碼管理中。若是項目被複制到任何其餘計算機（包括生成服務器、部署服務器和其餘開發計算機），僅使用 requirements.txt 便可輕鬆從新建立環境（這就是爲何環境不須要包含在源代碼管理中）。有關詳細信息，請參閱使用虛擬環境。

問：如何刪除已經提交給源代碼管理的虛擬環境？

答：首先，編輯 .gitignore 文件以排除文件夾：在末尾找到帶註釋 # Python Tools for Visual Studio (PTVS) 的部分，併爲虛擬環境文件夾添加一個新行，如 /BasicProject/env。（因爲 Visual Studio 不會顯示「解決方案資源管理器」中的文件，請使用「文件」 > 「打開」 > 「文件」菜單命令直接打開它。也能夠從團隊資源管理器打開文件：在「設置」頁上，選擇「存儲庫設置」，轉到「忽略和屬性文件」部分，而後選擇 .gitignore 旁的「編輯」連接。）

接下來，打開命令窗口，導航到包含虛擬環境文件夾（如 env）的文件夾（如 BasicProject），而後運行 git rm -r env。而後從命令行 (git commit -m 'Remove venv') 提交這些更改，或從「團隊資源管理器」的「更改」頁進行提交。

步驟 1-4：檢查樣本代碼

項目建立完成後，在解決方案資源管理器中查看解決方案和項目，其中項目僅包含兩個文件 app.py 和 requirements.txt：
如前文所述，requirements.txt 文件指定 Flask 包依賴項。該文件旨在邀請你在第一次建立項目時建立虛擬環境。
一個 app.py 文件包含三個部分。第一部分是 Flask import 語句，其做用是建立 Flask 類實例（分配給變量 app），而後分配 wsgi_app 變量（部署到 Web 主機時很是有用，可是現階段暫不使用）：

Python複製
```
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 
```

第二部分（文件末尾）是一些可選代碼，其做用是使用從環境變量中提取的特定主機和端口值（默認爲 localhost:5555）啓動 Flask 開發服務器：

Python複製

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)

第三部分是將函數分配到 URL 路由的一些短代碼，其做用是提供 URL 標識的資源。使用 Flask 的 @app.route 修飾器定義路由，其參數是站點根目錄中的相對 URL。正如代碼中所示，此處的函數僅返回文本字符串，已足夠瀏覽器呈現。在後面的步驟中，使用 HTML 呈現更豐富的頁面。

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

問：name 參數對 Flask 類的做用是什麼？

答：該參數是應用的模塊或包名稱，告知 Flask 查找屬於應用的模板、靜態文件和其餘資源的位置。對於單個模板中包含的應用，__name__ 始終是正確值。對須要調試信息的擴展也很是重要。有關詳細信息及其餘參數，請參閱 Flask 類文檔 (flask.pocoo.org)。

問：一個函數可否有多個路由修飾器？

答：能，若是同一個函數服務於多個路由，則可使用任意數量的修飾器。例如，若要爲「/」和「/hello」使用 hello 函數，請使用如下代碼：

Python複製

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

問：Flask 如何使用變量 URL 路由和查詢參數？

答：在路由中，使用 <variable_name> 標記任意變量，Flask 使用命名參數將參數傳遞到函數。變量能夠是 URL 路徑的一部分或在查詢參數中。例如，'/hello/<name> 形式的路由將名爲 name 的字符串參數生成到函數，在路由中使用 ?message=<msg> 分析爲「message=」查詢參數提供的值並將其傳遞到 msg 等函數：

Python複製

@app.route('/hello/<name>?message=<msg>') def hello(name, msg): return "Hello " + name + "! Message is " + msg + "."

若要更改類型，將變量前綴設爲 int、float、path（接受斜槓來講明文件夾名稱）和 uuid。有關詳細信息，請參閱 Flask 文檔中的變量規則。

還經過 request.args 屬性提供查詢參數，特別是經過 request.args.get 方法。有關詳細信息，請參閱 Flask 文檔中的請求對象。

問：在我安裝其餘包後，Visual Studio 可否從虛擬環境生成 requirements.txt 文件？

答：能夠。展開「Python 環境」節點，右鍵單擊虛擬環境，並選擇「生成 requirements.txt」命令。在修改環境，並將對 requirements.txt 所作的更改連同依賴於該環境的任何其餘代碼更改提交給源代碼管理時，建議按期使用此命令。若是在生成服務器上設置持續集成，應該在修改環境時生成文件並提交更改。

步驟 1-5：運行該項目

在 Visual Studio 中，選擇「調試」 > 「啓動調試」(F5) 或使用工具欄上的「Web 服務器」按鈕（所看到的瀏覽器可能會有所不一樣）：
任何一個命令將隨機端口號分配到 PORT 環境變量，而後運行 python app.py。代碼使用 Flask 開發服務器中的端口啓動應用。若是 Visual Studio 顯示「啓動調試器失敗」並顯示無啓動文件的相關消息，右鍵單擊解決方案資源管理器中的 app.py 並選擇「設爲啓動文件」。
服務器啓動時，會打開一個控制檯窗口，其中顯示服務器日誌。而後，Visual Studio 自動將瀏覽器打開到 http://localhost:<port>，其中應該看到 hello 函數呈現的消息：
完成後，經過關閉控制檯窗口，或使用 Visual Studio 中的「調試」 > 「中止調試」命令來中止服務器。

問：在項目 Python 子菜單中使用「調試」菜單命令和服務器命令有何區別？

答：除了「調試」菜單命令和工具欄按鈕以外，還可使用項目上下文菜單上的「Python」 > 「運行服務器」或「Python」 > 「運行調試服務器」命令來啓動服務器。這兩個命令都會打開一個控制檯窗口，能夠在其中看到運行服務器的本地 URL (localhost:port)。可是，必須使用該 URL 手動打開瀏覽器，而且運行調試服務器不會自動啓動 Visual Studio 調試器。若是須要，稍後可使用「調試」 > 「附加到進程」命令，將調試器附加到正在運行的進程。