gRPC服务端托管场景下Blazor WebAssembly调试相关问题咨询

方案1：HTTP/2服务端场景下正常调试Blazor WASM #

出现HTTP/2 over TLS was not negotiated报错的核心原因是TLS协商阶段没有完成HTTP/2协议的ALPN识别，可通过以下操作修复：

• 调试前关闭所有代理、VPN、流量抓包工具，这类工具会截断TLS协商的ALPN字段，导致浏览器无法和服务端协商HTTP/2协议。
• 显式配置Kestrel端点强制启用TLS 1.2/1.3和HTTP/2协议，代码示例：

webBuilder.ConfigureKestrel(serverOptions =>
{
    serverOptions.ConfigureEndpointDefaults(listenOptions =>
    {
        listenOptions.Protocols = HttpProtocols.Http2;
        listenOptions.UseHttps(opt =>
        {
            opt.SslProtocols = SslProtocols.Tls12 | SslProtocols.Tls13;
        });
    });
});

• 修改launchSettings.json配置，删除所有HTTP非加密端口的配置，仅保留HTTPS端口，避免调试启动时自动跳转非加密端口导致TLS协商失败。

方案2：分端口配置不同HTTP协议（更稳定的开发场景方案） #

如果方案1无法适配你的环境，可以通过多端口配置实现gRPC和Blazor调试端点使用不同HTTP协议：

• 在appsettings.json中配置两个独立的Kestrel端点，分别指定协议：

"Kestrel": {
  "Endpoints": {
    "GrpcService": {
      "Url": "https://localhost:7001",
      "Protocols": "Http2"
    },
    "BlazorHost": {
      "Url": "https://localhost:7002",
      "Protocols": "Http1AndHttp2"
    }
  }
}

• 前端gRPC客户端的调用地址单独配置为https://localhost:7001，Blazor静态资源、调试服务走https://localhost:7002端口即可。
• 配置跨域规则允许Blazor端点访问gRPC接口，代码示例：

builder.Services.AddCors(opt =>
{
    opt.AddPolicy("AllowBlazor", policy =>
    {
        policy.WithOrigins("https://localhost:7002")
              .AllowAnyHeader()
              .AllowAnyMethod()
              .AllowCredentials()
              .WithExposedHeaders("Grpc-Status", "Grpc-Message", "Grpc-Encoding", "Grpc-Accept-Encoding");
    });
});

// 中间件管道中启用CORS，放在路由之后、gRPC映射之前
app.UseRouting();
app.UseCors("AllowBlazor");
app.MapGrpcService<YourGrpcService>();

内容的提问来源于stack exchange，提问作者Björn Höper