將應用程式部署至App Service

發行項
08/05/2022

秘訣

此內容是適用于 ASP.NET Core 開發人員的電子書摘要，可在.NET Docs上取得，或作為可離線讀取的免費可下載 PDF。

Azure App 服務是 Azure 的 Web 裝載平臺。您可以手動或透過自動化程式，將 Web 應用程式部署至Azure App 服務。本指南的本節討論可使用命令列手動觸發或透過腳本觸發的部署方法，或使用 Visual Studio 手動觸發的部署方法。

在本節中，您將完成下列工作：

下載並建置範例應用程式。
使用 Azure Cloud Shell建立Azure App 服務 Web 應用程式。
使用 Git 將範例應用程式部署至 Azure。
使用 Visual Studio 將變更部署至應用程式。
將預備位置新增至 Web 應用程式。
將更新部署至預備位置。
交換預備與生產位置。

下載並測試應用程式

本指南中使用的應用程式是預先建置 ASP.NET Core應用程式簡易摘要讀取器。它是使用 API 擷取 RSS/Atom 摘要，並在清單中顯示新聞專案的 ASP.NET Core Razor Pages 應用程式 Microsoft.SyndicationFeed.ReaderWriter 。

請隨意檢閱程式碼，但請務必瞭解此應用程式沒有任何特殊之處。這只是簡單的 ASP.NET Core應用程式，僅供說明之用。

從命令殼層下載程式代碼、建置專案，然後執行，如下所示。

注意

Linux/macOS 使用者應該針對路徑進行適當的變更，例如使用正斜線 () / ，而不是反斜線 () \ 。*

將程式碼複製到本機電腦上的資料夾。

git clone https://github.com/dotnet-architecture/simple-feed-reader/

將您的工作資料夾變更為已建立 的 simple-feed-reader 資料夾。
```
cd .\simple-feed-reader\SimpleFeedReader
```
還原套件，並建置解決方案。
```
dotnet build
```
執行應用程式。
```
dotnet run
```
開啟瀏覽器並瀏覽至 http://localhost:5000 。應用程式可讓您輸入或貼上新聞訂閱摘要 URL，並檢視新聞專案清單。
一旦您滿意應用程式正常運作，請在命令殼層中按Ctrl+C將其關閉。

建立 Azure App 服務 Web 應用程式

若要部署應用程式，您必須建立App Service Web 應用程式。建立 Web 應用程式之後，您將使用 Git 從本機電腦部署至它。

登入Azure Cloud Shell。注意：當您第一次登入時，Cloud Shell提示建立組態檔的儲存體帳戶。接受預設值或提供唯一的名稱。
針對下列步驟使用 Cloud Shell。

a. 宣告變數來儲存 Web 應用程式的名稱。名稱必須是唯一的，才能用於預設 URL。 $RANDOM使用 Bash 函式來建構名稱可保證唯一性，並產生格式 webappname99999 。
```
webappname=mywebapp$RANDOM
```
b. 建立資源群組。資源群組提供將 Azure 資源匯總為群組的方法。
```
az group create --location centralus --name AzureTutorial
```
命令 az 會叫用 Azure CLI。 CLI 可以在本機執行，但在Cloud Shell使用它可節省時間和設定。

c. 在 S1 層中建立App Service方案。 App Service方案是共用相同定價層的 Web 應用程式群組。 S1 層不是免費層，但預備位置功能是必要的。
```
az appservice plan create --name $webappname --resource-group AzureTutorial --sku S1
```
d. 在相同的資源群組中使用App Service方案建立 Web 應用程式資源。
```
az webapp create --name $webappname --resource-group AzureTutorial --plan $webappname
```
e. 在組態中將部署分支設定為 mainappsettings 。
```
az webapp config appsettings set --name $webappname --resource-group AzureTutorial --settings DEPLOYMENT_BRANCH=main
```
f. 設定部署認證。這些部署認證適用于您訂用帳戶中的所有 Web 應用程式。請勿在使用者名稱中使用特殊字元。
```
az webapp deployment user set --user-name REPLACE_WITH_USER_NAME --password REPLACE_WITH_PASSWORD
```
g. 設定 Web 應用程式以接受來自本機 Git 的部署，並顯示 Git 部署 URL。 請注意此 URL 以供稍後參考。
```
echo Git deployment URL: $(az webapp deployment source config-local-git --name $webappname --resource-group AzureTutorial --query url --output tsv)
```
h. 顯示 Web 應用程式 URL。流覽至此 URL 以查看空白 Web 應用程式。 請注意此 URL 以供稍後參考。
```
echo Web app URL: http://$webappname.azurewebsites.net
```
在本機電腦上使用命令殼層，流覽至 Web 應用程式的專案資料夾 (例如 .\simple-feed-reader\SimpleFeedReader) 。執行下列命令來設定 Git 以推送至部署 URL：

a. 將遠端 URL 新增至本機存放庫。
```
git remote add azure-prod GIT_DEPLOYMENT_URL
```
b. 將本機預設分支 (主要) 推送至 azure prod 遠端的部署分支， (主要) 。
```
git push azure-prod main
```
系統會提示您輸入您稍早建立的部署認證。觀察命令殼層中的輸出。 Azure 會從遠端建置 ASP.NET Core應用程式。
在瀏覽器中，流覽至 Web 應用程式 URL ，並記下應用程式已建置並部署。您可以使用將其他變更認可至本機 Git 存放庫 git commit 。這些變更會使用上述 git push 命令推送至 Azure。

使用 Visual Studio 進行部署

注意

本節僅適用于 Windows。 Linux 和 macOS 使用者應該進行下列步驟 2 中所述的變更。儲存檔案，並使用認可變更至本機存放庫 git commit 。最後，使用 git push 推送變更，如第一節所示。*

應用程式已從命令殼層部署。讓我們使用 Visual Studio 的整合式工具，將更新部署至應用程式。在幕後，Visual Studio 會完成與命令列工具相同的動作，但在 Visual Studio 的熟悉 UI 內。

在 Visual Studio 中開啟 SimpleFeedReader.sln 。
在方案總管中，開啟Pages\Index.cshtml。將 <h2>Simple Feed Reader</h2> 變更為 <h2>Simple Feed Reader - V2</h2>。
按Ctrl+Shift+B建置應用程式。
在方案總管中，以滑鼠右鍵按一下專案，然後按一下 [發佈]。
Visual Studio 可以建立新的App Service資源，但此更新將會透過現有的部署發佈。在 [挑選發佈目標] 對話方塊中，從左側清單中選取[App Service]，然後選取 [選取現有]。按一下 [發佈]。
在[App Service] 對話方塊中，確認用來建立 Azure 訂用帳戶的 Microsoft 或組織帳戶會顯示在右上方。如果不是，請按一下下拉式清單並加以新增。
確認已選取正確的 Azure 訂用帳戶 。針對 [ 檢視]，選取 [資源群組]。展開 AzureTutorial 資源群組，然後選取現有的 Web 應用程式。按一下 [確定]。

Visual Studio 會建置應用程式並將其部署至 Azure。流覽至 Web 應用程式 URL。驗證專案 <h2> 修改是否為即時。

具有已變更標題的應用程式

部署位置

部署位置支援變更的預備環境，而不會影響生產環境中執行的應用程式。一旦品質保證小組驗證應用程式的暫存版本之後，就可以交換生產位置和預備位置。預備中的應用程式會以這種方式升階至生產環境。下列步驟會建立預備位置、部署一些變更，並在驗證之後將預備位置與生產環境交換。

如果尚未登入，請登入Azure Cloud Shell。

建立預備位置。

a. 使用 預備名稱建立部署位置。

az webapp deployment slot create --name $webappname --resource-group AzureTutorial --slot staging

b. 在組態中將部署分支設定為 mainappsettings 。

az webapp config appsettings set --name $webappname --resource-group AzureTutorial --slot staging --settings DEPLOYMENT_BRANCH=main

c. 設定預備位置以使用本機 Git 的部署，並取得預備部署 URL。 請記下此 URL 以供稍後參考。

echo Git deployment URL for staging: $(az webapp deployment source config-local-git --name $webappname --resource-group AzureTutorial --slot staging --query url --output tsv)

d. 顯示預備位置的 URL。流覽至 URL 以查看空的預備位置。 請記下此 URL 以供稍後參考。

echo Staging web app URL: http://$webappname-staging.azurewebsites.net

在文字編輯器或 Visual Studio 中，再次修改 Pages/Index.cshtml ，讓 <h2> 元素讀取 <h2>Simple Feed Reader - V3</h2> 並儲存檔案。
使用 Visual Studio的 [Team Explorer] 索引標籤中的 [變更] 頁面，或使用本機電腦的命令殼層輸入下列命令介面，將檔案認可至本機 Git 存放庫：
```
git commit -a -m "upgraded to V3"
```
使用本機電腦的命令殼層，將預備部署 URL 新增為 Git 遠端，並推送認可的變更：

a. 將預備的遠端 URL 新增至本機 Git 存放庫。
```
git remote add azure-staging <Git_staging_deployment_URL>
```
b. 將本機預設分支 (主要) 推送至 azure 預備 遠端的部署分支， (主要) 。
```
git push azure-staging main
```
等候 Azure 建置並部署應用程式。
若要確認 V3 已部署到預備位置，請開啟兩個瀏覽器視窗。在一個視窗中，流覽至原始的 Web 應用程式 URL。在其他視窗中，流覽至預備 Web 應用程式 URL。生產 URL 提供應用程式的 V2。預備 URL 提供應用程式的 V3。

在Cloud Shell中，將已驗證/準備的預備位置交換至生產環境。

az webapp deployment slot swap --name $webappname --resource-group AzureTutorial --slot staging

重新整理兩個瀏覽器視窗，以確認交換發生。

摘要

在本節中，已完成下列工作：

已下載並建置範例應用程式。
使用 Azure Cloud Shell建立Azure App 服務 Web 應用程式。
使用 Git 將範例應用程式部署至 Azure。
已使用 Visual Studio 將變更部署至應用程式。
已將預備位置新增至 Web 應用程式。
已將更新部署至預備位置。
交換預備和生產位置。

在下一節中，您將瞭解如何使用 Azure Pipelines 建置 DevOps 管線。

延伸閱讀

上一個下一個