如何在 Asp.Net MVC5 中启用 CORS

Question

我在本地运行 Angular 6 并在调用 MVC controller 操作方法时出现 CROS 错误。

我试图通过在我的 .net 应用程序的 web.config 文件中添加以下代码行来解决此问题。 但仍然遇到同样的错误。

<httpProtocol>
      <customHeaders>
        <clear />
        <add name="Access-Control-Allow-Origin" value="*" />
      </customHeaders>
    </httpProtocol>
  </system.webServer>

我不想通过禁用 web 安全性来运行浏览器我也不想创建 class 因为只在我的本地运行我需要启用 CORS。

在 Web.config 或 Global.asax 文件中是否有任何最简单的方法来解决此问题。

Answer 1

CORS需要3个标头才能正常工作。

MDN文档是记住CORS如何工作的重要资源。

您包含的标头将允许所有来源发出请求。 但是没有指定允许他们发出哪些请求，因此所有请求都被阻止。
要允许所有来源发出特定请求，您需要包括Access-Control-Allow-Methods标头，该标头告诉浏览器Web服务器在该端点上允许哪些请求。

根据请求的形成方式，您可能还需要包括Access-Control-Allow-Headers标头，该标头告诉浏览器允许将哪些标头发送到该端点上的Web服务器。

Access-Control-Allow-Origin: *
Access-Control-Allow-Methods: POST, GET, OPTIONS
Access-Control-Allow-Headers: Content-Type
Access-Control-Max-Age: 86400

使用所有这些，您的web.config的正确配置将是：

<?xml version="1.0" encoding="utf-8"?>
<configuration>
    <system.webServer>
        <httpProtocol>
            <customHeaders>
                <add name="Access-Control-Allow-Origin" value="*"/>
                <add name="Access-Control-Allow-Methods" value="GET,POST,OPTIONS"/>
                <add name="Access-Control-Allow-Headers" value="Content-Type"/>
            </customHeaders>
        </httpProtocol>
    </system.webServer>
</configuration>

这将允许您使用POST或GET访问该端点。 出于性能原因， Access-Control-Max-Age标头将告诉您的浏览器将这些结果缓存这么多秒。

---

另外，请确保不要在您正在运行的任何生产系统中包括此配置。 始终最好为可能需要的每个动作/控制器显式启用CORS。

Answer 2

将以下代码添加到Global.asax的Application_BeginRequest对我有用：

HttpContext.Current.Response.AddHeader("Access-Control-Allow-Origin", "http://localhost:7777/");

if (HttpContext.Current.Request.HttpMethod == "OPTIONS")
{
    //These headers are handling the "pre-flight" OPTIONS call sent by the browser
    HttpContext.Current.Response.AddHeader("Access-Control-Allow-Methods", "POST, GET");
    HttpContext.Current.Response.AddHeader("Access-Control-Allow-Headers", "content-type");
    HttpContext.Current.Response.End();
}

使用所需的url 、方法和标题

此外，无需更改Web.config中的任何内容