使用 visual studio 容器工具调试 blazor wasm

Question

我在我的一些项目中使用 blazor wasm（由 aspnet core 托管）已有一段时间了。由于 dotnet 核心，我更喜欢运行我在容器中的应用程序。 Visual studio 具有容器和编排支持，我已将其添加到我的 blazor 解决方案中，它在发布配置中运行良好。

然而，当我尝试使用调试配置（又名 container fast mode）时，出现以下错误：

System.ArgumentException: The path must be absolute. (Parameter 'root')
   at Microsoft.Extensions.FileProviders.PhysicalFileProvider..ctor(String root, ExclusionFilters filters)
   at Microsoft.Extensions.FileProviders.PhysicalFileProvider..ctor(String root)
   at Microsoft.AspNetCore.Builder.BlazorHostingApplicationBuilderExtensions.UseClientSideBlazorFiles(IApplicationBuilder app, String clientAssemblyFilePath)
   at Microsoft.AspNetCore.Builder.BlazorHostingApplicationBuilderExtensions.UseClientSideBlazorFiles[TClientApp](IApplicationBuilder app)
   at BlazorWasmOnDocker.Server.Startup.Configure(IApplicationBuilder app, IWebHostEnvironment env) in D:\OpenSource\aspnetcore-apis\BlazorWasmOnDocker\BlazorWasmOnDocker\Server\Startup.cs:line 36
   at System.RuntimeMethodHandle.InvokeMethod(Object target, Object[] arguments, Signature sig, Boolean constructor, Boolean wrapExceptions)
   at System.Reflection.RuntimeMethodInfo.Invoke(Object obj, BindingFlags invokeAttr, Binder binder, Object[] parameters, CultureInfo culture)
   at Microsoft.AspNetCore.Hosting.ConfigureBuilder.Invoke(Object instance, IApplicationBuilder builder)
   at Microsoft.AspNetCore.Hosting.ConfigureBuilder.<>c__DisplayClass4_0.<Build>b__0(IApplicationBuilder builder)
   at Microsoft.AspNetCore.Hosting.ConventionBasedStartup.Configure(IApplicationBuilder app)

我已经看到为此创建了多个 github 问题，例如https://github.com/aspnet/AspNetCore/issues/9704#issuecomment-544272050 但由于 blazor wasm 尚未结束测试，这些问题尚未解决。

如何运行由 asp 托管的 blazor wasm 作为快速模式下的容器？

Answer 1

为了隔离这个问题，我使用最新的 visual studio 模板（blazor 3.1 预览版 4）和最新的 visual studio 创建了一个托管在 ASP.net 核心中的 blazor wasm 应用程序2019 预览。

在搭建解决方案后，我在 visual studio 中添加了 docker 支持和编排支持。这为我提供了一个可以在运行处于发布模式时运行的设置。

为了修复调试 mode/container 快速模式，我阅读了 visual studio 运行容器如何处于调试和发布模式。请参阅 https://aka.ms/containerfastmode 以了解 Visual Studio 如何使用生成的 Dockerfile 构建您的图像以加快调试速度。

简而言之：当使用发布模式时 visual studio 构建您的 docker 文件并因此创建您的应用程序构建 并在容器本身中发布 将在 /app.

中创建一个包含您的 asp 服务器和 blazor 客户端的应用程序

使用调试模式时 visual studio 只会运行您的 docker 文件的第一阶段，然后将您的 'server' 项目装载到容器中。然后它会在你的机器上构建你的 'server' 项目（这比在容器中构建它更快），因为服务器项目已安装，编译结果也在容器中。 Visual studio 然后在启动您的应用程序的容器中启动远程调试会话。

调试设置与发布设置的不同之处在于调试时没有发布，因此 blazor 客户端不会复制到您的 asp 服务器应用程序中，而是与生成的 blazor 配置文件链接（它是在你的 bin 目录中，我的命名为 BlazorWasmOnDocker.Client.blazor.config).

由于在容器外构建运行，生成的 blazor.config 也创建了仅在容器外有效的链接。对于我的设置，它是这样的：

D:\Software\repos\aspnetcore-apis\BlazorWasmOnDocker\BlazorWasmOnDocker\Client\BlazorWasmOnDocker.Client.csproj

这就是问题所在，或者实际上是 2 个问题：

客户端项目没有挂载到容器中
Blazor 项目的配置位置不正确运行装在容器中

可以通过创建调试 docker-compose.yml 文件（将其命名为 docker-compose.vs.debug.yml 以便 visual studio 将在调试时使用它）来解决第一个问题，其中添加挂载到客户端项目：

version: '3.4'

services:
  blazorwasmondocker.server:
    volumes:
      - ./BlazorWasmOnDocker/Client:/Client

可以通过在调试构建后更正生成的 blazor 配置中的客户端项目路径来解决第二个问题。我在 program.cs 中这样做了，您也可以在容器启动或 post 构建挂钩中这样做。


        public static void Main(string[] args)
        {
#if DEBUG
            const string blazorConfigPath = @"/app/bin/Debug/netcoreapp3.1/BlazorWasmOnDocker.Client.blazor.config";
            var blazorConfig = File.ReadAllText(blazorConfigPath);
            blazorConfig = Regex.Replace(blazorConfig, @"[a-zA-Z]:\.+?\Client\", "/Client/")
                .Replace('\', '/');
            File.WriteAllText(blazorConfigPath, blazorConfig);
#endif

            BuildWebHost(args).Run();
        }

作为参考，我已将演示项目推送到 github 并将修复程序放在 1 次提交中：https://github.com/Rora/aspnetcore-apis/commit/7ef4682d1466bd94faaba9adafac2cb0f6f59723

使用 visual studio 容器工具调试 blazor wasm

Debug blazor wasm using visual studio container tools

visual-studio

docker

blazor-client-side