容器化Blazor WebAssembly應用程式

ASP.NET Core Blazor 應用程式分兩種：一種是需要依賴於後臺宿主程序的Server App，另一種是直接在瀏覽器中執行的WebAssembly。WebAssembly是純前端的，其中內嵌了一個微小版的.NET執行時，一次載入之後，整個WebAssembly就可以在瀏覽器程序中，通過內嵌的.NET執行時完成載入執行。

瞭解到這一點，就可以知道，其實任何具有提供靜態資源服務的Web伺服器，都可以成為Blazor WebAssembly應用程式的宿主程序，在此，我們選用nginx。下面是Dockerfile的內容：

FROM nginx:alpine AS base
WORKDIR /usr/share/nginx/html
EXPOSE 80

FROM mcr.microsoft.com/dotnet/sdk:6.0 AS build
WORKDIR /src
COPY . .
RUN dotnet build "BlazorApp1.csproj" -c Release -o /app/build

FROM build AS publish
RUN dotnet publish "BlazorApp1.csproj" -c Release -o /app/publish

FROM base as final
WORKDIR /usr/share/nginx/html
COPY --from=publish /app/publish/wwwroot .
CMD ["nginx", "-g", "daemon off;"]

其中包含四個階段（stage）：

1. base：定義將用nginx作為最後的容器的base image
2. build：定義了專案的編譯過程，這個過程跟普通的ASP.NET Core專案的編譯過程是一樣的
3. publish：通過dotnet publish命令，將專案的編譯結果釋出到本地資料夾
4. final：將publish階段得到的釋出結果複製到base階段所產生的容器中

然後，在當前目錄下，執行下面的命令，就可以編譯docker映象：

docker build -t daxnet/blazor-app-1 .

編譯成功之後，可以用下面的命令啟動容器：

docker run -it -p 8090:80 daxnet/blazor-app-1

容器啟動之後，用瀏覽器訪問http://localhost:8090，就可以開啟Blazor WebAssembly應用了：

（總訪問量：9；當日訪問量：9）