容器化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):
- base:定義將用nginx作為最後的容器的base image
- build:定義了專案的編譯過程,這個過程跟普通的ASP.NET Core專案的編譯過程是一樣的
- publish:通過dotnet publish命令,將專案的編譯結果釋出到本地資料夾
- 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)
「其他文章」
- C#中被調函式已判空後仍報空引用警告問題的處理方法
- 容器化Blazor WebAssembly應用程式
- 再談基於Ocelot API閘道器和IdentityServer的API認證與授權
- 再談使用IdentityServer實現ASP.NET Core Web API的認證與授權
- Apache Kafka快速演練
- Saga體系結構模式:微服務架構下跨服務事務的實現
- 快速理解ASP.NET Core的認證與授權
- Visual Studio 2022新特性
- 徒手打造基於Spark的資料工廠(Data Factory):從設計到實現
- 何時使用領域驅動設計
- Angular SPA基於Ocelot API閘道器與IdentityServer4的身份認證與授權(三)
- Angular SPA基於Ocelot API閘道器與IdentityServer4的身份認證與授權(一)
- 在Ocelot中使用自定義的中介軟體(一)
- 基於Angular 8和Bootstrap 4實現動態主題切換
- ASP.NET Core 2.0 Web API專案升級到ASP.NET Core 3.0概要筆記