请求标头数据多次出现而不是一次

Question

我正在开发一个网络应用程序（Angular + .NET 6）。我在调用 API 时遇到了一个奇怪的问题（无论是从应用程序还是从 swagger）。这两个应用程序都包含在使用 SPA 中间件的同一个 .NET 解决方案中。

每当我想调用我的端点之一（在我创建角度应用程序并配置我的 API 以使用它之前工作）时，请求需要花费很多时间才能完成，并且我最终会遇到 HTTP 500 错误.NET 控制台中的这条消息：

[webpack-dev-server] [HPM] Error occurred while proxying request localhost:52432/api/client/ClientCareCategory/GetAll to https://localhost:44386/ [HPE_HEADER_OVERFLOW]

我查看了那个调用的响应头，我看到头的内容很奇怪：

x-powered-by: Express, ASP.NET, ASP.NET, ASP.NET, ASP.NET, ASP.NET, ASP.NET, ASP.NET, ASP.NET, ASP.NET, ASP.NET, ASP.NET, ASP.NET.......

请注意，即使使用自定义标头配置，我也有这个倍增的内容（例如：添加 X-XSS-Protection 或 X-Content-Type-Options）。我想这就是

HPE_HEADER_OVERFLOW

的原因。但我无法找到这种奇怪行为的起源。

我试过了：

• 删除我的自定义中间件
• 检查了我的中间件代码
• 检查我的 Angular 应用配置
• 搜索我正在使用的版本（.NET 6、Angular 15、Node 18）的已知问题

但我没能解决我的问题。

这是我的 Program.cs（我删除了 DbContext、服务和存储库）：

var builder = WebApplication.CreateBuilder(args);

// Add services to the container.
builder.Services.AddCors(options => 
    options.AddPolicy("Default", policyBuilder =>
    {
        policyBuilder
            .AllowAnyOrigin()
            .AllowAnyMethod()
            .AllowAnyHeader();
    })
);

builder.Services.AddControllers();
builder.Services.AddAuthentication(x =>
{
    x.DefaultAuthenticateScheme = JwtBearerDefaults.AuthenticationScheme;
    x.DefaultChallengeScheme = JwtBearerDefaults.AuthenticationScheme;
}).AddJwtBearer(o =>
{
    o.SaveToken = true;
    o.TokenValidationParameters = new TokenValidationParameters
    {
        ValidateIssuer = false,
        ValidateAudience = false,
        ValidateIssuerSigningKey = true,
        IssuerSigningKey = new SymmetricSecurityKey(
            Encoding.UTF8.GetBytes(
                builder.Configuration
                    .GetSection(ApplicationSettings.Section)
                    .GetValue<string>("JWT:Secret")))
    };
});

builder.Services.AddSpaStaticFiles(configuration =>
{
    configuration.RootPath = "ClientApp/dist";
});

builder.Services.AddSwaggerGen(config =>
{
    config.SwaggerDoc("Backend", new OpenApiInfo { Title = "Backend", Version = "0.1"});

    config.AddSecurityDefinition("Bearer", new OpenApiSecurityScheme
    {
        In = ParameterLocation.Header,
        Description = "Please enter a valid token",
        Name = "Authorization",
        Type = SecuritySchemeType.Http,
        BearerFormat = "JWT",
        Scheme = "Bearer"
    });

    var securityRequirement = new OpenApiSecurityRequirement
    {
        {
            new OpenApiSecurityScheme
            {
                Reference = new OpenApiReference
                {
                    Type = ReferenceType.SecurityScheme,
                    Id = "Bearer"
                }
            },
            Array.Empty<string>()
        }
    };

    config.AddSecurityRequirement(securityRequirement);
});

var app = builder.Build();

app.UseMiddleware<ExceptionHandlerMiddleware>();
app.UseMiddleware<JwtMiddleware>();
app.UseMiddleware<AntiXssMiddleware>();

app.UseRouting();

app.UseCors("Default");

app.UseAuthentication();
app.UseAuthorization();

app.MapControllers();   

if (app.Environment.IsDevelopment())
{
    app.UseSwagger();
    app.UseSwaggerUI(options =>
    {
        options.SwaggerEndpoint("/swagger/Backend/swagger.json", "Backend");
    });

    app.UseStaticFiles();
    app.UseSpa(spa =>
    {
        spa.Options.SourcePath = "ClientApp";
        spa.UseAngularCliServer(npmScript: "start");
    });
}
else
{
    app.UseHttpsRedirection();
    app.UseStaticFiles();
    app.UseSpaStaticFiles();

    app.UseSpa(spa =>
    {
        spa.Options.SourcePath = "ClientApp";
        spa.Options.DefaultPageStaticFileOptions = new StaticFileOptions
        {
            FileProvider = new PhysicalFileProvider(Path.Combine(app.Environment.ContentRootPath, "ClientApp", "dist")),
            RequestPath = ""
        };
    });
}

app.Run();

这是我的 Angular 配置：

------------------- package.json
"scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "build:ssr": "ng run Institut:server:dev",
    "watch": "ng build --watch --configuration development",
    "test": "ng test",
    "lint": "ng lint"
},

------------------- angular.json
"serve": {
    "builder": "@angular-devkit/build-angular:dev-server",
    "options": {
        "browserTarget": "Institut:build",
        "proxyConfig": "src/proxy.conf.json"
    },
    "configurations": {
        "production": {
            "browserTarget": "Institut:build:production"
        },
        "development": {
            "browserTarget": "Institut:build:development"
        }
    },
    "defaultConfiguration": "development"
},

------------------- proxy.conf.json
{
  "/api": {
    "target": "https://localhost:44386",
    "secure": false
  }
}

我的配置有问题吗？还有什么我可以检查我还没有做的吗？

如果您需要更多信息，请告诉我。

谢谢！

编辑：附加信息

我还尝试从 Microsoft 的 .NET + Angular template 开始，它非常适合开发，但是当我尝试通过 GitHub Actions 部署我的应用程序时，我收到一条错误消息，指出提供给 ng serve 的选项不是已知（--port、--ssl-cert、-ssl-key）。我假设此配置可以在 Azure 应用服务上运行，但我没有找到解决此问题的方法。