asp.net-web-api - 多个 CORS 适用于 GET 但不适用于具有飞行前请求 Web api 2 的 PUT/POST

Question

当我像下面这样在我的 Web.config 中配置 CORS 时，一切正常:

<customHeaders>
<add name="Access-Control-Allow-Origin" value="http://localhost:3000"/>
<add name="Access-Control-Allow-Methods" value="GET, PUT, POST, DELETE, HEAD, OPTIONS"/>
<add name="Access-Control-Allow-Headers" value="accept, cache-control, credentials, content-type, authorization, origin, X-Requested-With, X-dev-mode"/>
</customHeaders>

但是，当我尝试像这样启用多个 CORS 时:

// Filename: Global.asax.cs
protected override void Application_Start()
{
   ApiConfig.Register(GlobalConfiguration.Configuration);
}

// Filename: ApiConfig.cs
public static void Register(HttpConfiguration config)
{
   var cors = new EnableCorsAttribute("http://localhost:3000,http://someOtherUrl.com/", "*", "*");
   config.EnableCors(cors);
}

它适用于 GET(即获取内容等)，但是，当使用 POST/PUT(即保存内容等)时，它会在浏览器 (Chrome) 控制台中给出此错误

Fetch API cannot load http://localhost:56214/api/1/content/SAVE. Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:3000' is therefore not allowed access. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.

请求在 OPTIONS 上失败。请注意，我确实有自定义处理程序并且我的路由也已配置。还有一件事要提到的是，用于保存内容的 PUT/POST 调用是通过 React 进行的 ajax 调用。这会成为问题吗？

Answer 1

问题是您的第二个 URL 中的尾部斜杠。把它改成这样就可以了:

var cors = new EnableCorsAttribute("http://localhost:3000,http://someOtherUrl.com", "*", "*");