CORS 停止 Angular 应用程序和 .NET CORE 3.0 API 之间的通信

Posted 2023-03-04

【中文标题】CORS 停止 Angular 应用程序和 .NET CORE 3.0 API 之间的通信

【英文标题】：CORS stopping communication between Angular app and .NET CORE 3.0 API

【发布时间】：2020-11-10 01:35:45

【问题描述】：

我试图避免发布这个问题，因为有很多其他人喜欢，但在尝试了似乎每种组合后都没有解决我的问题。

问题

当我的 Angular 应用程序在 IIS EXPRESS 上本地运行时，它可以 POST 到我的 Web API。但是当 API 部署到 IIS 时，我的 Angular 应用程序无法发布到它。但是，它可以在两种环境中成功执行 GET 请求。

错误

从源“https://mySite:1233”访问“https://mySite:1234/api/v1/postData”处的 XMLHttpRequest 已被 CORS 策略阻止：对预检请求的响应未通过访问控制检查：请求的资源上不存在“Access-Control-Allow-Origin”标头。

我尝试过的/代码

两个应用程序都在不同的端口上运行，所以我明白为什么我需要配置 CORS，经过大量阅读后，我发现没有为 GET 请求发出飞行前请求 (as covered in the Mozilla Docs)，所以这可以解释原因GET 请求成功。 Mozilla 文档让我相信我的 POST 不属于简单请求类别，因为它需要授权，但这并不能回答它在 IIS EXPRESS 而不是 IIS 上的工作方式（我认为 express 不那么严格？）。

在关注official docs 并且无法使其工作然后查看各种SO posts 并尝试各种选择之后，我走到了死胡同，真的希望有人能指出我在哪里出错了

Startup.cs

public class Startup

    private const string ALLOWED_ORIGINS = "allowedOrigin";
    ...other stuff...
    public void ConfigureServices(IServiceCollection services)
    
        services.AddCors(options =>
        
            options.AddPolicy(name: ALLOWED_ORIGINS,
                builder =>
                
                    builder.WithOrigins("https://myLocalSite:1233", "https://myDeployedSite:1233")//these values are retrieve from config 
                        .AllowAnyMethod()
                        .AllowAnyHeader();
                );
        );

        services.AddControllers()

        ....other stuff... 

        services.AddMvc(o =>
        
            var policy = new AuthorizationPolicyBuilder()
                .RequireAuthenticatedUser()
                .Build();
            o.Filters.Add(new AuthorizeFilter(policy));
        );

        ....other stuff... 
    

    public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
    
        ...other stuff...

        app.UseRouting();

        app.UseCors(ALLOWED_ORIGINS);

        app.UseAuthentication();

        app.UseAuthorization();

        app.UseEndpoints(endpoints =>
        
            endpoints.MapControllers();
        );
        ...other stuff...
       

控制器

[ApiController]
[ApiVersion("1.0")]
[Route("api/vversion:apiVersion/[controller]")]
public class PostDataController : ControllerBase

    ...other stuff...

    [HttpPost]
    public async Task<SomeResponse> Post(SomeRequest sr)
    
        ...other stuff...
    

终于

我没有添加任何角度代码，因为我认为问题出在我的 API 设置中。如果需要，我很乐意添加代码

【问题讨论】：

错误信息有 mysite，它不在 cors 策略中。这是转移到 Stack Overflow 的错字吗？

这是一个错字，谢谢指出

【参考方案1】：

尝试将 AddMvc 放在“AddCors”之前。

健全性检查：从 AllowAnyOrigin 开始，按照自己的方式进行更精细的定义

public class Startup

public void ConfigureServices(IServiceCollection services)

    services.AddCors();


public void Configure(IApplicationBuilder app)

    app.UseCors(policy => policy.WithOrigins(ALLOWED_ORIGINS));

看起来你有那些（上图）。

你有（下）吗？

public class Startup

    public void ConfigureServices(IServiceCollection services)
    

        services.Configure<CorsOptions>(options =>
        
            options.AddPolicy(
                "AllowAnySimpleRequest",
                builder =>
                
                    builder.AllowAnyOrigin()
                           .WithMethods("GET", "POST", "HEAD");
                );

查看此文件以获得更好的“完整上下文”代码。 https://csharp.hotexamples.com/site/file?hash=0x8b07b2262d54348025f4b69ad1c3a6e517321a0d14cca0e0bf05aed12f88424f&fullName=Startup.cs&project=psilon2000/LUV