容器化Blazor WebAssembly应用程序

By | 2022年8月13日

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应用了:

(总访问量:67;当日访问量:1)

发表回复

您的电子邮箱地址不会被公开。

此站点使用Akismet来减少垃圾评论。了解我们如何处理您的评论数据