如何使用 CORS 启用自定义标头？

Posted 2023-03-04

【中文标题】如何使用 CORS 启用自定义标头？

【英文标题】：How do I enable custom headers with CORS?

【发布时间】：2021-12-03 22:10:25

【问题描述】：

我正在尝试按照 Microsoft 的指南在我的 C# Web API 上设置 CORS，该指南位于 here。以下是我遵循的步骤。

安装 CORS。

在 WebApiConfig 类中启用 CORS。

在控制器中为给定端点启用 CORS。

现在应该注意的是，此端点确实需要自定义标头。我目前的理解是，当我使用 EnableCors 属性并为标题使用通配符“*”时，所有标题都是允许的。但是，当我尝试调用此端点时，我在 Chrome 开发工具中遇到了以下错误。

从源“http://localhost:12345”访问“https://myapi/getdata/myid”处的 XMLHttpRequest 已被 CORS 策略阻止：访问控制不允许请求标头字段 myheaderfield - 预检响应中的允许标头。

我尝试将允许的标头从通配符“*”更改为“myheaderfield”，但错误仍然相同。

以下是我用来进行此调用的 JS XHR 请求。

var xhr = new XMLHttpRequest();
xhr.addEventListener("readystatechange", function () 
    if (this.readyState === 4) 
        console.log(this.responseText);
    
);

xhr.open("GET", "https://myapi/getdata/myid");
xhr.setRequestHeader("myheaderfield", "abc123");

xhr.send();

【问题讨论】：

对于 .Net 5/ASP.Net Core，请尝试以下 abdulraheem alarpi 的 suggestion。对于一般带有 CORS 的客户标头，请看这里：developer.mozilla.org/en-US/docs/Web/HTTP/Headers/…

我觉得你可以试试myapi/getdata/?id=myid在调用JS的时候

【参考方案1】：

只允许标头在 asp.net core 中访问

在这样的 ConfigureServices 中：

services.AddCors(options => options.AddPolicy("name of cors", builder => 
            
                builder.AllowAnyOrigin().AllowAnyMethod().AllowAnyHeader();
            ));

【讨论】：

这仅在 .Net 5/ASP.Net Core 中可用吗？我在.Net 4.7.2 :(

【参考方案2】：

在 Asp.Net 4.7.2 中，要允许任何标题，请将标题设置为“*”。要允许特定的标头，请将标头设置为允许标头的逗号分隔列表，如下所示：

[EnableCors(origins: "http://example.com", 
    headers: "accept,content-type,origin,x-my-header", methods: "*")]

此链接解释了 .Net 框架中的完整 Cors

https://docs.microsoft.com/en-us/aspnet/web-api/overview/security/enabling-cross-origin-requests-in-web-api

【参考方案3】：

在 .NET 4.7 中，如果要全局添加自定义标头，请在 Register 方法上执行以下操作：

 public static void Register(HttpConfiguration config)
    
        var cors = new EnableCorsAttribute("www.example.com", "*", "*");
        config.EnableCors(cors);
        // ...
    

如果你想按控制器，然后在你的注册方法和你的控制器上添加config.EnableCors(cors);，如下所示：

[EnableCors(origins: "http://example.com", 
    headers: "accept,content-type,origin,x-my-header", methods: "*")]

【讨论】：

如果您使用的是 .NET 4.7.2，那么这将起作用。请告诉我，不要忘记标记为答案。