angular - 如何将 CORS header 添加到 401/403 响应中？

Question

我构建了一个 spa 网站，前端使用 Angular，服务器端使用 asp.net Core Web Api 3.0。

我正在尝试配置 Windows 身份验证，感谢 this article到目前为止，一切都很好!但是...当 Api 正确返回 401/403 时，CORS header 会出现问题，cors header 会丢失。这是一个例子:

General:
Status Code: 403 Forbidden
Remote Address: [::1]:44389
Referrer Policy: no-referrer-when-downgrade
Response-Headers:
Date: Wed, 20 Nov 2019 16:33:57 GMT
Persistent-Auth: true
Server: Microsoft-IIS/10.0
Transfer-Encoding: chunked
X-Powered-By: ASP.NET

这是我使用 [Authorise] 属性时生成的内容。我遇到的问题是，当 CORS header 丢失时， Angular 内的状态代码为 0，因此我的 http 拦截器不知道未经授权，并且无​​法正确处理重定向。

我尝试在 StartUp 中使用中间件手动添加 header :

app.Use(async (context, next) =>
{
    context.Response.OnStarting(() =>
    {
        context.Response.Headers.Add("Access-Control-Allow-Origin", "http://localhost:4200");

        return Task.FromResult(0);
    });

    await next();
});

但这不起作用，中间件仍然删除 header 。

有趣的是，如果我删除授权属性并在 Controller 方法中返回 401/403:

[HttpGet]
public IActionResult Get()
    => Unauthorized();

CORS header 返回如下:

Response-Headers:
Access-Control-Allow-Credentials: true
Access-Control-Allow-Origin: http://localhost:4200  

这是不可行的!

有人知道如何确保授权中间件保留 CORS header 吗？

Answer 1

事实证明一切都配置正确，几乎!

问题只是在 StartUp 类中配置中间件的顺序。我不知道中间件的配置顺序对执行有影响。这是我原来的代码:

app.UseRouting();

app.UseAuthentication()
   .UseAuthorization();

app.UseCors(builder => builder.WithOrigins("http://localhost:4200")
                                      .AllowCredentials()
                                      .AllowAnyMethod()
                                      .AllowAnyHeader());

app.UseEndpoints(endpoints => { endpoints.MapControllers(); });

配置 Cors 之前身份验证解决了问题，现在中间件处理的未经授权的请求仍然包含 cors header 。

app.UseRouting();

app.UseCors(builder => builder.WithOrigins("http://localhost:4200")
                                      .AllowCredentials()
                                      .AllowAnyMethod()
                                      .AllowAnyHeader());
app.UseAuthentication()
   .UseAuthorization();

app.UseEndpoints(endpoints => { endpoints.MapControllers(); });