Docker部署Blazor项目时QuickGrid.razor.js文件404问题求助

问题概述 #

依赖QuickGrid v9.0.1的Blazor项目在本地运行时，可正常获取/_framework/blazor.web.js和/_content/Microsoft.AspNetCore.Components.QuickGrid/QuickGrid.razor.js；但在Docker容器中运行时，后者返回404，触发JSInterop异常。

关键概念说明 #

/_content/[NuGet包ID]/是Blazor的虚拟路径，专门用于托管NuGet包中包含的静态资源。这些资源在项目发布时，会被自动复制到输出目录的wwwroot/_content/[NuGet包ID]/物理路径下，容器运行时Blazor会将虚拟路径映射到该物理路径提供访问。

问题根源分析 #

当前Dockerfile将Server和Client项目的发布产物都输出到同一个/app/publish目录，容易导致Client项目的静态Web资产（包括NuGet包的JS文件）被Server文件覆盖；此外，未显式确保静态Web资产的发布逻辑生效，导致NuGet包的资源未被正确复制到最终容器中。

解决方案 #

1. 确保Client项目启用静态Web资产 #

在Client.csproj中添加或确认以下配置，强制确保发布时包含NuGet包的静态资源：

<PropertyGroup>
  <!-- 强制启用静态Web资产处理，避免Release模式下默认关闭导致资源丢失 -->
  <StaticWebAssetsEnabled>true</StaticWebAssetsEnabled>
</PropertyGroup>

2. 修改Dockerfile，避免发布产物冲突 #

将Server和Client的发布目录分开，确保Client的静态资源不被覆盖。修改后的Dockerfile如下：

# 基础运行镜像
FROM mcr.microsoft.com/dotnet/aspnet:9.0-nanoserver-1809 AS base
WORKDIR /app
EXPOSE 5088
EXPOSE 5089
EXPOSE 5157
EXPOSE 5158
EXPOSE 8080

# 构建镜像
FROM mcr.microsoft.com/dotnet/sdk:9.0-nanoserver-1809 AS build
ARG BUILD_CONFIGURATION=Release
WORKDIR /src
COPY ["Server/Server.csproj", "Server/"]
COPY ["Client/Client.csproj", "Client/"]
RUN dotnet restore "./Server/Server.csproj"
RUN dotnet restore "./Client/Client.csproj"
COPY . .

# 构建Server项目
WORKDIR "/src/Server"
RUN dotnet build "./Server.csproj" -c %BUILD_CONFIGURATION% -o /app/build/server

# 构建Client项目
WORKDIR "/src/Client"
RUN dotnet build "./Client.csproj" -c %BUILD_CONFIGURATION% -o /app/build/client

# 发布阶段
FROM build AS publish
ARG BUILD_CONFIGURATION=Release

# 发布Server到独立目录
WORKDIR "/src/Server"
RUN dotnet publish "./Server.csproj" -c %BUILD_CONFIGURATION% -o /app/publish/server /p:UseAppHost=false

# 发布Client到独立目录，显式启用静态Web资产
WORKDIR "/src/Client"
RUN dotnet publish "./Client.csproj" -c %BUILD_CONFIGURATION% -o /app/publish/client /p:UseAppHost=false /p:StaticWebAssetsEnabled=true

# 最终运行镜像
FROM base AS final
WORKDIR /app
# 复制Client的完整发布产物（包含wwwroot及NuGet静态资源）
COPY --from=publish /app/publish/client .
# 复制Server项目的数据库文件
COPY --from=publish /app/publish/server/ocb.db .
ENTRYPOINT ["dotnet", "Client.dll"]

3. 验证结果 #

构建并运行容器后，进入容器检查/app/wwwroot/_content/Microsoft.AspNetCore.Components.QuickGrid/路径，确认QuickGrid.razor.js已存在。此时浏览器可正常通过/_content/Microsoft.AspNetCore.Components.QuickGrid/QuickGrid.razor.js访问该文件，JSInterop异常将被解决。

内容的提问来源于stack exchange，提问作者twhatm9