跨源资源共享(Cross-Origin Resource Sharing, CORS)是一种基于http头的机制，它允许服务器指明浏览器应该允许加载资源的任何源(域、方案或端口)，而不是它自己的源

来自跨原产地资源共享(CORS)

简而言之，网络服务器会告诉你(你的浏览器)你应该信任哪些网站。

Scammysite。Bad尝试告诉浏览器向good-api-site.good发送请求 good-api-site。Good告诉浏览器它应该只信任other-good-site.good 你的浏览器说你真的不应该相信诈骗网站。Bad对good-api-site的请求。很好，CORS救了你。

如果你正在创建一个网站，你真的不关心谁与你集成。犁。在ACL中设置*。

但是，如果您正在创建一个站点，并且只允许站点X，甚至站点X、Y和Z，则使用CORS指示客户端浏览器只信任这些站点与您的站点集成。

浏览器当然可以选择忽略这一点。再次强调，CORS保护的是你的客户，而不是你。

CORS允许定义*或一个站点。这可能会限制你，但你可以通过在你的web服务器上添加一些动态配置来解决这个问题——并帮助你变得具体。

这是一个关于如何在Apache中为每个站点配置CORS的示例:

# Save the entire "Origin" header in Apache environment variable "AccessControlAllowOrigin"
# Expand the regex to match your desired "good" sites / sites you trust
SetEnvIfNoCase Origin "^https://(other-good-site\.good|one-more-good.site)$" AccessControlAllowOrigin=$0
# Assuming you server multiple sites, ensure you apply only to this specific site
<If "%{HTTP_HOST} == 'good-api-site.com'">
    # Remove headers to ensure that they are explicitly set
    Header        unset Access-Control-Allow-Origin   env=AccessControlAllowOrigin
    Header        unset Access-Control-Allow-Methods  env=AccessControlAllowOrigin
    Header        unset Access-Control-Allow-Headers  env=AccessControlAllowOrigin
    Header        unset Access-Control-Expose-Headers env=AccessControlAllowOrigin
    # Add headers "always" to ensure that they are explicitly set
    # The value of the "Access-Control-Allow-Origin" header will be the contents saved in the "AccessControlAllowOrigin" environment variable
    Header always set Access-Control-Allow-Origin   %{AccessControlAllowOrigin}e     env=AccessControlAllowOrigin
    # Adapt the below to your use case
    Header always set Access-Control-Allow-Methods  "POST, GET, OPTIONS, PUT"        env=AccessControlAllowOrigin
    Header always set Access-Control-Allow-Headers  "X-Requested-With,Authorization" env=AccessControlAllowOrigin
    Header always set Access-Control-Expose-Headers "X-Requested-With,Authorization" env=AccessControlAllowOrigin
</If>

我们的团队在使用Vue.js、Axios和c# Web API时偶尔会遇到这种情况。在您试图命中的端点上添加路由属性为我们修复了它。

[Route("ControllerName/Endpoint")]
[HttpOptions, HttpPost]
public IHttpActionResult Endpoint() { }

如果您碰巧使用IIS服务器，您可以在HTTP请求头选项中设置以下头。

Access-Control-Allow-Origin:*
Access-Control-Allow-Methods: 'HEAD, GET, POST, PUT, PATCH, DELETE'
Access-Control-Allow-Headers: 'Origin, Content-Type, X-Auth-Token';

所有这些POST、GET等都可以正常工作。

我让它工作，添加选项方法到Access-Control-Allow-Methods:

Access-Control-Allow-Methods: GET, OPTIONS

但是!同样，这在Chrome和Firefox中都有效，但遗憾的是在Chromium中行不通。

在ASP。NET Core Web API，这个问题通过添加“Microsoft.AspNetCore. NET”得到了解决。Cors”(版本1.1.1)，并在Startup.cs中添加以下更改。

public void ConfigureServices(IServiceCollection services)
{
    services.AddCors(options =>
    {
        options.AddPolicy("AllowAllHeaders",
            builder =>
            {
                builder.AllowAnyOrigin()
                       .AllowAnyHeader()
                       .AllowAnyMethod();
            });
    });
    .
    .
    .
}

and

public void Configure(IApplicationBuilder app, IHostingEnvironment env, ILoggerFactory loggerFactory)
{
    // Shows UseCors with named policy.
    app.UseCors("AllowAllHeaders");
    .
    .
    .
}

并在控制器中放入[EnableCors("AllowAllHeaders")]。

检查请求是否发送到正确的端点。在我的Node.js项目中，我提到了错误的端点，请求将前往/api/txn/12345，端点是/api/txn而不是/api/txn/:txnId，这导致了这个错误。