將容器化應用程式部署至 Azure
在本指南中,您將學習如何:
- 為您的應用程式建立容器映像檔。
- 將映像檔推送至容器登錄庫。
- 將映像檔部署至 Azure App Service 或 Azure Container Apps。
先決條件
- 一個 Azure 訂閱。
- 必須安裝 Container Tools 與 Azure App Service 擴充功能。
- 一個會產生容器映像檔的 Web 應用程式。您也可以依照建立範例 ASP .NET Core 應用程式來建立此類應用程式。
- 您需要一個 Docker Hub 帳戶或一個 Azure Container Registry (ACR) 實例。
建立應用程式映像檔
如果您已經有映像檔,請跳過此步驟並繼續執行「將映像檔推送至容器登錄庫」步驟。
-
在 VS Code 中開啟應用程式資料夾。
-
開啟命令面板 (⇧⌘P (Windows, Linux Ctrl+Shift+P)) 並使用 Container Images: Build Image... 命令來建置映像檔。

您可以在 Build Image 命令的輸出中找到映像檔名稱,同樣的資訊也可以在 Container Explorer 的 Images 窗格中找到。

將映像檔推送至容器登錄庫
在將映像檔部署至 App Service 或 Container App 之前,必須先將映像檔上傳至容器登錄庫。映像檔可以上傳至 Azure Container Registry (ACR) 或 Docker Hub。
-
開啟 Container Explorer,在 Registries 群組下選擇 Connect Registry... 圖示,並依照提示操作。選擇供應商 (Azure 或 Docker Hub) 並提供認證以連線至登錄庫。

-
現在,登錄庫將會顯示在 Registries 下方。

-
您可以選擇性地標記 (Tag) 映像檔。為了將映像檔上傳至登錄庫,映像檔需要使用登錄庫名稱進行標記,以便
docker push命令能將其上傳至正確的登錄庫。-
若要在 Azure ACR 中建立登錄庫,請開啟 Container Explorer 的 Registries 區段,登入 Azure (若尚未登入),然後對您要使用的訂閱按一下滑鼠右鍵,並選擇 Create Registry。
-
在上一個章節中建置的映像檔將會出現在 Container Explorer 的 Images 區段中。按一下滑鼠右鍵並選擇 Tag...。

-
指定新名稱
<您的登錄庫或使用者名稱>/<映像檔名稱>:<標籤>並完成標記動作。例如,名為 WebApp6 的 ACR,其新映像檔名稱為 'webapp6.azurecr.io/webapp6:latest';若是 Docker Hub,則為 'myusername/webapp6:latest'。
-
-
映像檔將會顯示在 Container Explorer 中,位於該映像檔標籤所指向的登錄庫下方。選擇此映像檔並選擇 Push。如果尚未標記映像檔,系統會提示您選擇要推送到的登錄庫,並會根據選擇為映像檔加上標籤。

-
當 push 命令完成後。重新整理推送映像檔所在的登錄庫節點,上傳的映像檔即會顯示。

將映像檔部署至 Azure
在上一個章節中,映像檔已推送至遠端容器登錄庫。現在將此映像檔部署至 Azure App Service 或 Azure Container Apps。
-
在 Container Explorer 中,瀏覽至 Registries 下的映像檔,在標籤上按一下滑鼠右鍵,並選擇 Deploy Image To Azure App Service... 或 Deploy Image to Azure Container Apps...。

-
出現提示時,請提供 App Service 或 Container App 的值。
- New web app name (新 Web 應用程式名稱):名稱在整個 Azure 中必須是唯一的。
- Resource group (資源群組):選擇現有的資源群組或建立新的資源群組。
- App Service plan (App Service 方案):選擇現有的 App Service 方案或建立新的。 (App Service 方案定義了代管網站的實體資源;在本教學課程中,您可以使用基本或免費方案層)。
-
部署完成後,Visual Studio Code 會顯示包含網站 URL 的通知。

-
您也可以在 Visual Studio Code 的 Output 面板中的 Container Tools 區段查看結果。

-
若要瀏覽已部署的網站,您可以使用 Ctrl+click 開啟 Output 面板中的 URL。您可能需要稍等片刻,讓應用程式在 Azure 中啟用。新的 App Service 或 Container App 也會出現在 Visual Studio Code 的 Azure 檢視中,您可以在該處對網站按一下滑鼠右鍵並選擇 Browse Website。

後續步驟
繼續閱讀以深入了解:
- Azure 擴充功能 - VS Code Marketplace 提供數百個適用於 Azure 與雲端的擴充功能。
- 部署至 Azure - 逐步學習如何將應用程式部署至 Azure。
- 使用 MongoDB - 在 VS Code 內建立、管理及查詢 MongoDB 資料庫。