MVC web api：請求的資源上不存在“Access-Control-Allow-Origin”標頭

Question

我嘗試了本文中寫的所有內容： http : //www.asp.net/web-api/overview/security/enabling-cross-origin-requests-in-web-api ，但沒有任何效果。 我正在嘗試從 webAPI2 (MVC5) 獲取數據以使用 angularJS 在另一個域中使用。

我的控制器看起來像這樣：

namespace tapuzWebAPI.Controllers
{
    [EnableCors(origins: "http://local.tapuz.co.il", headers: "*", methods: "*", SupportsCredentials = true)]
    [RoutePrefix("api/homepage")]
    public class HomePageController : ApiController
    {
        [HttpGet]
        [Route("GetMainItems")]
        //[ResponseType(typeof(Product))]
        public List<usp_MobileSelectTopSecondaryItemsByCategoryResult> GetMainItems()
        {


            HomePageDALcs dal = new HomePageDALcs();
            //Three product added to display the data

            //HomePagePromotedItems.Value.Add(new HomePagePromotedItem.Value.FirstOrDefault((p) => p.ID == id));


            List<usp_MobileSelectTopSecondaryItemsByCategoryResult> items = dal.MobileSelectTopSecondaryItemsByCategory(3, 5);
            return items;

        }      
    }
}

Answer 1

您需要在Web Api 中啟用CORS 。 全局啟用 CORS 的更簡單和首選的方法是將以下內容添加到web.config

<system.webServer>
  <httpProtocol>
    <customHeaders>
      <add name="Access-Control-Allow-Origin" value="*" />
      <add name="Access-Control-Allow-Headers" value="Content-Type" />
      <add name="Access-Control-Allow-Methods" value="GET, POST, PUT, DELETE, OPTIONS" />
    </customHeaders>
  </httpProtocol>
</system.webServer>

請注意，方法都是單獨指定的，而不是使用* 。 這是因為在使用*時發生了錯誤。

您還可以通過代碼啟用CORS 。

更新
需要以下NuGet包： Microsoft.AspNet.WebApi.Cors 。

public static class WebApiConfig
{
    public static void Register(HttpConfiguration config)
    {
        config.EnableCors();

        // ...
    }
}

然后你可以像這樣在動作或控制器上使用[EnableCors]屬性

[EnableCors(origins: "http://www.example.com", headers: "*", methods: "*")]

或者你可以全局注冊

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

        // ...
    }
}

您還需要辦理預檢Options與請求HTTP OPTIONS請求。

Web API需要響應Options請求，以確認它確實配置為支持CORS 。

要處理這個問題，您需要做的就是發回一個空響應。 您可以在您的操作中執行此操作，也可以像這樣全局執行此操作：

# Global.asax.cs
protected void Application_BeginRequest()
{
    if (Request.Headers.AllKeys.Contains("Origin") && Request.HttpMethod == "OPTIONS")
    {
        Response.Flush();
    }
}

添加此額外檢查是為了確保設計為僅接受GET和POST請求的舊APIs不會被利用。 想象一下，當這個動詞不存在時，向一個設計的API發送一個DELETE請求。 結果是不可預測的，結果可能是危險的。

Answer 2

@Mihai-Andrei Dinculescu 的回答是正確的，但為了搜索者的利益，還有一個微妙的地方可能會導致此錯誤。

在 URL 末尾添加“/”將阻止 EnableCors 在所有情況下（例如從主頁）工作。

即這行不通

var cors = new EnableCorsAttribute("http://testing.azurewebsites.net/", "*", "*");
config.EnableCors(cors);

但這會起作用：

var cors = new EnableCorsAttribute("http://testing.azurewebsites.net", "*", "*");
config.EnableCors(cors);

如果使用 EnableCors 屬性，效果相同。

Answer 3

我遵循了Mihai-Andrei Dinculescu指出的所有步驟。
但就我而言，我還需要1 個步驟，因為 http OPTIONS 在 Web.Config 中被以下行禁用。

<remove name="OPTIONSVerbHandler" />

我剛剛從 Web.Config 中刪除了它（只需像下面一樣評論它），Cors 就像一個魅力

<handlers>
  <!-- remove name="OPTIONSVerbHandler" / -->
</handlers>

Answer 4

可能是因為安裝了 Cors nuget 包。

如果您在從 nuget 安裝和啟用 cors 后遇到問題，那么您可以嘗試重新安裝 web Api。

在包管理器中，運行Update-Package Microsoft.AspNet.WebApi -reinstall

Answer 5

試試這個，以確保你正確配置了 CORS：

[EnableCors(origins: "*", headers: "*", methods: "*")]

還是行不通？ 檢查 HTTP 標頭是否存在。

Answer 6

我知道我來得很晚。 但是，對於正在搜索的任何人，我想我會發布最終對我有用的內容。 我並不是說這是最好的解決方案——只是說它有效。

我們的 WebApi 服務使用 config.EnableCors(corsAttribute) 方法。 然而，即便如此，它仍然會在飛行前請求上失敗。 @Mihai-Andrei Dinculescu 的回答為我提供了線索。 首先，我添加了他的 Application_BeginRequest() 代碼來刷新選項請求。 那仍然對我不起作用。 問題是 WebAPI 仍然沒有向 OPTIONS 請求添加任何預期的標頭。 單獨沖洗它沒有用 - 但它給了我一個想法。 我添加了自定義標頭，否則這些標頭將通過 web.config 添加到 OPTIONS 請求的響應中。 這是我的代碼：

protected void Application_BeginRequest()
{
  if (Request.Headers.AllKeys.Contains("Origin") && Request.HttpMethod == "OPTIONS")
  {
    Response.Headers.Add("Access-Control-Allow-Origin", "https://localhost:44343");
    Response.Headers.Add("Access-Control-Allow-Headers",
      "Content-Type, Access-Control-Allow-Headers, Authorization, X-Requested-With");
    Response.Headers.Add("Access-Control-Allow-Methods", "GET, POST, PUT, DELETE, OPTIONS");
    Response.Headers.Add("Access-Control-Allow-Credentials", "true");
    Response.Flush();
  }
}

顯然，這僅適用於 OPTIONS 請求。 所有其他動詞都由 CORS 配置處理。 如果有更好的方法來解決這個問題，我會全力以赴。 對我來說這感覺像是作弊，我更喜歡自動添加標題，但這最終奏效並讓我繼續前進。

Answer 7

要使任何 CORS 協議工作，您需要在每個端點（或具有此方法的全局過濾器）上都有一個 OPTIONS 方法，該方法將返回這些標頭：

Access-Control-Allow-Origin: *
Access-Control-Allow-Methods: GET, POST, PUT, DELETE
Access-Control-Allow-Headers: content-type

原因是瀏覽器將首先發送一個 OPTIONS 請求來“測試”您的服務器並查看授權

Answer 8

我抓住了關於 cors 的下一個案例。 也許這對某人有用。 如果您將功能“WebDav 重定向器”添加到您的服務器，PUT 和 DELETE 請求將失敗。

因此，您需要從 IIS 服務器中刪除“WebDAVModule”：

• “在 IIS 模塊配置中，循環 WebDAVModule，如果您的 Web 服務器有它，則將其刪除”。

或添加到您的配置：

<system.webServer>
<modules>
  <remove name="WebDAVModule"/>
</modules>
<handlers>
  <remove name="WebDAV" />
  ...
</handlers>

Answer 9

當您嘗試從不同的域或不同的端口訪問時，就會發生該問題。

如果您使用的是 Visual Studio，請轉到“工具”>“NuGet 包管理器”>“包管理器控制台”。 在那里你必須安裝 NuGet 包Microsoft.AspNet.WebApi.Cors

Install-Package Microsoft.AspNet.WebApi.Cors

然后，在 PROJECT > App_Start > WebApiConfig 中，啟用 CORS

public static class WebApiConfig
{
    public static void Register(HttpConfiguration config)
    {
        
        //Enable CORS. Note that the domain doesn't have / in the end.
        config.EnableCors(new EnableCorsAttribute("https://tiagoperes.eu",headers:"*",methods:"*"));

        ....

    }
}

成功安裝后，構建解決方案就足夠了

Answer 10

@Mihai-Andrei Dinculescu 的回答對我有用，例如：

• 在 web.config 的<system.webServer>部分添加一個<httpProtocol>
• 通過global.asax提到的Application_BeginRequest()為OPTIONS請求返回空響應

除了他對Request.Headers.AllKeys.Contains("Origin")檢查對我不起作用，因為請求包含origing ，所以使用小寫。 我認為我的瀏覽器（Chrome）會像這樣為 CORS 請求發送它。

我通過使用他的Contains檢查的不區分大小寫的變體來更通用地解決這個問題： if (culture.CompareInfo.IndexOf(string.Join(",", Request.Headers.AllKeys), "Origin", CompareOptions.IgnoreCase) >= 0) {

Answer 11

如果您的 web.config 中有 security\\requestFiltering 節點，如下所示：

<security>
  <requestFiltering>
    <verbs allowUnlisted="false">
      <add verb="GET" allowed="true" />
      <add verb="POST" allowed="true" />
      <add verb="PUT" allowed="true" />
      <add verb="DELETE" allowed="true" />
      <add verb="DEBUG" allowed="true" />          
    </verbs>
  </requestFiltering>

確保你也添加這個

<add verb="OPTIONS" allowed="true" />

Answer 12

我已經嘗試了所有可以在網上找到的方法，包括在這個答案中給出的方法。 在幾乎嘗試解決問題一整天之后，我找到了對我有用的解決方案。

在文件夾App_Start中的文件WebApiConfig中，注釋所有代碼行並添加以下代碼：

`public static void Register(HttpConfiguration config)
    {
        // Web API configuration and services
        config.EnableCors();
        var enableCorsAttribute = new EnableCorsAttribute("*",
                                           "Origin, Content-Type, Accept",
                                           "GET, PUT, POST, DELETE, OPTIONS");
        config.EnableCors(enableCorsAttribute);
        // Web API routes
        config.MapHttpAttributeRoutes();

        config.Routes.MapHttpRoute(
            name: "DefaultApi",
            //routeTemplate: "api/{controller}/{id}",
            routeTemplate: "api/{controller}/{action}/{id}",
            defaults: new { id = RouteParameter.Optional }
        );
        config.Formatters.Add(new BrowserJsonFormatter());
    }

    public class BrowserJsonFormatter : JsonMediaTypeFormatter
    {
        public BrowserJsonFormatter()
        {
            this.SupportedMediaTypes.Add(new MediaTypeHeaderValue("text/html"));
            this.SerializerSettings.Formatting = Formatting.Indented;
        }

        public override void SetDefaultContentHeaders(Type type, HttpContentHeaders headers, MediaTypeHeaderValue mediaType)
        {
            base.SetDefaultContentHeaders(type, headers, mediaType);
            headers.ContentType = new MediaTypeHeaderValue("application/json");
        }
    }`

Answer 13

我知道人們一開始可能會覺得這很明顯，但仔細想想。 如果您做錯了什么，這通常會發生。

例如，我遇到了這個問題，因為我沒有在我的主機文件中添加主機條目。 真正的問題是 DNS 解析。 或者我只是把基本 URL 弄錯了。

如果身份令牌來自一台服務器，有時我會收到此錯誤，但我正在嘗試在另一台服務器上使用它。

有時，如果您的資源有誤，您會收到此錯誤。

如果您將 CORS 中間件放入鏈中太晚，您可能會得到這個。

Answer 14

避免多處啟用 CORS，如 WebApiCOnfig.cs、提供者中的 GrantResourceOwnerCredentials 方法和 Controller Header 屬性等。以下是導致訪問控制允許來源的列表

1. 與您使用的數據庫交互的網絡有問題。
2. AWS Cloud 如果 Web API 和 DB 的 VPC 不同。

下面的代碼足以修復訪問控制允許來源。 //確保 app.UseCors 應該是配置代碼行的頂部。

   public partial class Startup
    {
        public void Configuration(IAppBuilder app)
        {
            app.UseCors(Microsoft.Owin.Cors.CorsOptions.AllowAll);
            //All other configurations
        }
    }

這減緩了我的問題。

Answer 15

安裝包：Microsoft.AspNet.WebApi.Cors

轉到：App_Start --> WebApiConfig

添加 ：

var cors = new EnableCorsAttribute("http://localhost:4200", " ", " "); config.EnableCors(cors);

注意：如果您添加“/”作為特定 url 的結尾對我不起作用。

Answer 16

對於那些只是在 .NET 5 中創建 Web API 而不是 Web 應用程序的人，在Startup.cs您需要像這樣配置您的策略：

public void ConfigureServices(IServiceCollection services)
{
    // Additional configs above...
    services.AddCors(options =>
    {
        options.AddPolicy("AllowAnyOrigin", builder =>
        {
            // Allow "Access-Control-Allow-Origin: *" header
            builder.AllowAnyOrigin();
        });
    });
}

public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
{
    // Add this above other config options...
    app.UseCors("AllowAnyOrigin");
}

Answer 17

我知道這聽起來很瘋狂，但對我來說是 [HttpPost()] 而不是 [HttpPost]。 當我刪除多余的括號時，它開始工作