【Azure App Service For Container】建立ASP.NET Core Blazor項目並打包爲Linux鏡像發佈到Azure應用服務

歡迎使用 Blazor！Blazor 是一個使用 .NET 生成交互式客戶端 Web UI 的框架：

• 使用 C# 代替 JavaScript 來建立信息豐富的交互式 UI。
• 共享使用 .NET 編寫的服務器端和客戶端應用邏輯。
• 將 UI 呈現爲 HTML 和 CSS，以支持衆多瀏覽器，其中包括移動瀏覽器。
• 與新式託管平臺（如 Docker）集成。

 

任務描述

使用VS2019模板建立Blazor項目，添加Dockerfile打包爲Linux鏡像，最後發佈到Azure應用服務， 並查看鏡像的發佈日誌和啓動日誌。要完成此次任務，須要提早準備如下條件：

1）安裝VS2019，Docker Desktop，App Service For Container, Azure Container Registry(ACR)

2）VS 2019 鏈接到中國區Azure帳號，可參考文章： 鏈接到微軟雲Azure中國區 By VS 2019, VS Code, Powershell

 

第一步：建立Blazor項目

• 在VS 2019中建立新項目，選擇Blazor App模板(如無此模板，則下載並安裝最新的.Net SDK便可)，建立包含Client端(WebAssembly)的項目
• 選擇MyLife.Blazor.Server項目爲啓動項目，F5測試本地運行狀況

第二步：建立Linux鏡像並本地部署測試

• 必須啓動Docker Desktop應用並配置爲使用Linux容器，默認爲Windows容器，點擊Docker運行圖標右鍵選擇"Switch to Linux Container"

• 在VS 2019中，選中MyLife.Blazor.Server項目，右鍵添加「Docker Support」，選擇「Linux」。

 

添加Dockerfile的文件內容爲：

#See https://aka.ms/containerfastmode to understand how Visual Studio uses this Dockerfile to build your images for faster debugging.

FROM mcr.microsoft.com/dotnet/aspnet:5.0-buster-slim AS base
WORKDIR /app
EXPOSE 80
EXPOSE 443

FROM mcr.microsoft.com/dotnet/sdk:5.0-buster-slim AS build
WORKDIR /src
COPY ["MyLife.Blazor/Server/MyLife.Blazor.Server.csproj", "MyLife.Blazor/Server/"]
COPY ["MyLife.Blazor/Shared/MyLife.Blazor.Shared.csproj", "MyLife.Blazor/Shared/"]
COPY ["MyLife.Blazor/Client/MyLife.Blazor.Client.csproj", "MyLife.Blazor/Client/"]
RUN dotnet restore "MyLife.Blazor/Server/MyLife.Blazor.Server.csproj"
COPY . .
WORKDIR "/src/MyLife.Blazor/Server"
RUN dotnet build "MyLife.Blazor.Server.csproj" -c Release -o /app/build

FROM build AS publish
RUN dotnet publish "MyLife.Blazor.Server.csproj" -c Release -o /app/publish

FROM base AS final
WORKDIR /app
COPY --from=publish /app/publish .
ENTRYPOINT ["dotnet", "MyLife.Blazor.Server.dll"]

• 根據VS 2019的錯誤提示，在Docker Desktop中選擇Setting -> Resources ->File sharing中添加當前項目文件路徑。

SECURITY WARNING: You are building a Docker image from Windows against a non-Windows Docker host. All files and directories added to build context will have '-rwxr-xr-x' permissions. It is recommended to double check and reset permissions for sensitive files and directories.

• 在Docker Desktop中查看Blazor項目運行狀況

 

第三步：發佈到ACR並開啓Admin訪問權限

• 在VS 2019中點擊發布「Publish」，選擇ACR(Azure Container Registry).

• 登陸到ACR門戶，開啓Admin User訪問權限

 

第四步：建立App Service for Container

• 建立App Service（https://portal.azure.cn/#create/Microsoft.WebSite），選擇Docker Container，Operating System爲Linux。其餘值則隨意而定。

• 在Docker中選擇Image Source爲ACR(Azure Container Registry)。 並選擇上一步上傳的Image最新版

• 驗證完成後，點擊建立便可。

 

第五步：查看鏡像拉取日誌及Container啓動日誌

• 登陸到第四步建立的App Service門戶頁面，點擊Container settings頁面，查看Image的設置及拉取日誌

• 在App Service門戶的Log Stream頁面，查看Container啓動日誌

注意：若是應用修改後從新生成了Image，應用服務經過重啓（restart）及能夠拉取最新的鏡像並部署。

 

(Source：https://docs.microsoft.com/en-us/azure/app-service/quickstart-custom-container?pivots=container-windows#update-locally-and-redeploy)

 

參考資料：

Run a custom container in Azure: https://docs.microsoft.com/en-us/azure/app-service/quickstart-custom-container?pivots=container-windows#update-locally-and-redeploy