ASP.NET Core CORS WebAPI: brak nagłówka Access-Control-Allow-Origin

Question

Zainstalowałem mój web API ASP.NET Core na platformie Azure i mogę uzyskać dostęp do jego punktów końcowych za pomocą narzędzia Swagger lub debugera internetowego, takiego jak Fiddler. W obu przypadkach (tego samego pochodzenia, Swagger, różne pochodzenie użyciu Skrzypek z mojego komputera), gdy dostęp do API uzyskać oczekiwany rezultat, z CORS włączyć w następujący sposób w moim Startup.cs:

1. dodać services.AddCors(); do ConfigureServices.

2. dodać middleware do Configure: Jestem świadomy, że tutaj liczy się kolejność (ASP.NET 5: Access-Control-Allow-Origin in response), więc jestem umieszczenie tego połączenia na górze metody, tylko poprzedzony logowania lub pośredniej diagnostycznym; tutaj jest moja metoda pełna:

public void Configure(IApplicationBuilder app, IHostingEnvironment env, 
    ILoggerFactory loggerFactory, 
    IDatabaseInitializer databaseInitializer) 
{ 
    loggerFactory.AddConsole(Configuration.GetSection("Logging")); 
    loggerFactory.AddDebug(); 
    loggerFactory.AddNLog(); 

    // to serve up index.html 
    app.UseDefaultFiles(); 
    app.UseStaticFiles(); 

    // http://www.talkingdotnet.com/aspnet-core-diagnostics-middleware-error-handling/ 
    app.UseDeveloperExceptionPage(); 
    app.UseDatabaseErrorPage(); 

    // CORS 
    // https://docs.asp.net/en/latest/security/cors.html 
    app.UseCors(builder => 
      builder.WithOrigins("http://localhost:4200", "http://www.myclientserver.com") 
       .AllowAnyHeader() 
       .AllowAnyMethod()); 

    app.UseOAuthValidation(); 
    app.UseOpenIddict(); 
    app.UseMvc(); 

    databaseInitializer.Seed().GetAwaiter().GetResult(); 
    env.ConfigureNLog("nlog.config"); 

    // swagger 
    app.UseSwagger(); 
    app.UseSwaggerUi(); 
} 

The localhost CORS jest używany w trakcie rozwoju i odnosi się do aplikacji Angular2 CLI. CORS działa dobrze lokalnie, a moje aplikacje klienckie i API znajdują się w różnych portach na tym samym hoście lokalnym, więc jest to "prawdziwe" źródło pochodzenia (zauważam to z powodu sugestii, które znalazłem tutaj: https://weblog.west-wind.com/posts/2016/Sep/26/ASPNET-Core-and-CORS-Gotchas: autor postu zauważa, że ​​nagłówek CORS w odpowiedzi jest wysyłany tylko, gdy jest to wymagane, tj. w prawdziwych środowiskach krzyżowych).

Używanie Fiddlera Mogę pomyślnie uzyskać dostęp do zdalnego interfejsu API, ale otrzymuję nagłówek NIE Access-Control-Allow-Origin. Tak więc, gdy wywołanie API z przeglądarki (poprzez mojej aplikacji klienckiej) wniosek AJAX nie powiedzie się, nawet jeśli serwer zwraca 200. Próbka Fiddler żądanie (sukces):

GET http://mywebapisiteurl/api/values HTTP/1.1 
User-Agent: Fiddler 

odpowiedzi:

HTTP/1.1 200 OK 
Transfer-Encoding: chunked 
Content-Type: application/json; charset=utf-8 
Server: Microsoft-IIS/8.0 
X-Powered-By: ASP.NET 
Set-Cookie: ARRAffinity=3d551180c72208c1d997584c2b6119cf44e3a55c868f05ffc9258d25a58e95b1;Path=/;Domain=prinapi.azurewebsites.net 
Date: Thu, 01 Dec 2016 10:30:19 GMT 

["value1","value2"] 

podczas próby dostępu do zdalnego API rozmieszczone na Azure, moja aplikacja klient nie zawsze jej żądania AJAX z błędem:

No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://www.myclientserver.com' is therefore not allowed access. 

Oto przykładowy kod klienta za pomocą Angular2 (używając Plunker):

Podsumowując, wydaje się, że serwer ASPNET API nie zwraca oczekiwanych nagłówków CORS, a zatem mój klient oparty na przeglądarce hostowany na innym początku nie działa. Jednak konfiguracja CORS wydaje się być w porządku, przynajmniej sądząc z przytoczonej dokumentacji; Jestem w prawdziwym środowisku krzyżowym; i umieszczam oprogramowanie pośrednie przed innymi. Może brakuje mi czegoś oczywistego, ale szukanie w Google to wszystkie zalecenia, które znalazłem. Jakaś wskazówka?

UPDATE

W odpowiedzi na @Daniel JG: żądanie/odpowiedź z Skrzypek są udane:

GET http://theapiserver/api/values HTTP/1.1 
User-Agent: Fiddler 
Host: theapiserver 
Origin: http://theappserver/apps/prin 

oraz:

HTTP/1.1 200 OK 
Content-Type: application/json; charset=utf-8 
Server: Microsoft-IIS/8.0 
Access-Control-Allow-Origin: http://theappserver/apps/prin 
X-Powered-By: ASP.NET 
Set-Cookie: ARRAffinity=3d551180c72208c1d997584c2b6119cf44e3a55c868f05ffc9258d25a58e95b1;Path=/;Domain=theapiserver 
Date: Thu, 01 Dec 2016 14:15:21 GMT 
Content-Length: 19 

["value1","value2"] 

Żądanie/odpowiedź z Angular2 (Plunker) zamiast tego, jak donosi, nie.Poprzez kontrolę ruchu sieciowego, widzę tylko inspekcji wstępnej żądanie:

OPTIONS http://theapiserver/api/values HTTP/1.1 
Host: theapiserver 
Proxy-Connection: keep-alive 
Access-Control-Request-Method: GET 
Origin: http://run.plnkr.co 
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/54.0.2840.99 Safari/537.36 
Access-Control-Request-Headers: content-type 
Accept: */* 
Referer: http://run.plnkr.co/h17wYofXGFuTy2Oh/ 
Accept-Encoding: gzip, deflate, sdch 
Accept-Language: en-US,en;q=0.8,it;q=0.6 

HTTP/1.1 204 No Content 
Server: Microsoft-IIS/8.0 
X-Powered-By: ASP.NET 
Set-Cookie: ARRAffinity=3d551180c72208c1d997584c2b6119cf44e3a55c868f05ffc9258d25a58e95b1;Path=/;Domain=theapiserver 
Date: Thu, 01 Dec 2016 14:23:02 GMT 

po tym, żądanie kończy się niepowodzeniem i nie większy ruch idzie do serwera. Podawane problemem jest to, że Response to preflight request doesn't pass access control check, ponownie z powodu braku nagłówka w odpowiedzi:

XMLHttpRequest cannot load http://theapiserver/api/values. Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://run.plnkr.co' is therefore not allowed access. 

Answer 1

Dodanie metody .AllowAnyOrigin() może rozwiązać problem

app.UseCors(builder => 
     builder.WithOrigins("http://localhost:4200", "http://www.myclientserver.com") 
      .AllowAnyOrigin() 
      .AllowAnyHeader() 
      .AllowAnyMethod()); 

Answer 2

WebAPI projektu ---> w prawo kliknij na References ---> Szukaj rdzenia w sekcji Zarządzaj pakietami Nuget. Dodaj Microsoft.AspNet.WebApi.Cors do projektu, instalując

Dodaj następujący kod do pliku WebApi.Config w folderze App_Start w projekcie.

var cors = new EnableCorsAttribute ("", "", "*"); config.EnableCors (cors);

enter image description here

enter image description here