Problemy z zasadami CORS i .NET Core 3.1


11

Nie jestem pewien, czego mi brakuje, ale wydaje mi się, że moje zasady CORS nie współpracują z .NET Core 3.1 i Angular 8 po stronie klienta.

Startup.cs:

        public void ConfigureServices(IServiceCollection services)
        {
            // ...

            // Add CORS policy
            services.AddCors(options =>
            {
                options.AddPolicy("foo",
                builder =>
                {
                    // Not a permanent solution, but just trying to isolate the problem
                    builder.AllowAnyOrigin().AllowAnyMethod().AllowAnyHeader();
                });
            });

            services.AddControllers();
        }

        public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
        {
            if (env.IsDevelopment())
            {
                app.UseDeveloperExceptionPage();
            }

            app.UseHttpsRedirection();

            // Use the CORS policy
            app.UseCors("foo");

            app.UseRouting();

            app.UseAuthorization();

            app.UseEndpoints(endpoints =>
            {
                endpoints.MapControllers();
            });
        }

Komunikat o błędzie po stronie klienta:

Access to XMLHttpRequest at 'https://localhost:8082/api/auth/' from origin 'http://localhost:4200' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

AKTUALIZACJA:

Mimo, że był konfigurowania CORS niepoprawnie (i poniżej akceptowanego odpowiedź rzeczywiście w tym pomóc) źródłem emisji było niezależne. Dla dodatkowego kontekstu aplikacja działała całkowicie dobrze podczas uruchamiania interfejsu API i aplikacji Angular przy użyciu interfejsu CLI - ten problem występował dopiero po wdrożeniu ich obu na serwerze WWW.

„Rzeczywisty” problem zakończony został związany z połączenia SQL, którą odkryto dopiero po dodaniu rejestrowanie błędów płaskim pliku do API i działa ślad SQL Server do stwierdzenia, że aplikacja nie była w stanie połączyć się z SQL w ogóle.

Zwykle spodziewałbym się, że zwróci to 500 i zdałbym sobie sprawę z tego problemu w ciągu 10 sekund - jednak błędna konfiguracja CORS oznaczała, że ​​500 nigdy nie zostało zwrócone, ponieważ oprogramowanie pośrednie CORS zawiodło jako pierwsze. To było niezwykle frustrujące, mówiąc absolutnie! . Chciałbym jednak dodać to tutaj, na wypadek, gdyby inni znaleźli się w takiej sytuacji, ponieważ „ścigałem niewłaściwego królika”, jeśli wolisz. Po naprawieniu konfiguracji CORS zdałem sobie sprawę, że faktyczny problem był całkowicie niezwiązany z CORS.

TL; DR; - Czasami błędy po stronie serwera „non-CORS” .NET mogą zostać zwrócone jako błędy CORS, jeśli zasady CORS nie są ustawione poprawnie

Bibliografia:

https://docs.microsoft.com/en-us/aspnet/core/security/cors?view=aspnetcore-3.1#cors-with-named-policy-and-middleware

https://medium.com/swlh/cors-headers-with-dot-net-core-3-5c9dfc664785


1
spróbuj ustawić app.UseCors("foo");wcześniejapp.UseHttpsRedirection();
— StepUp

@StepUp dziękuję za zalecenie, ale wciąż nie ma szczęścia
— KMJungersen,

Czy rozwiązałeś swój problem?
— StepUp

Czy ktoś rozwiązał ten problem? Dlaczego żadna odpowiedź nie jest akceptowana?
— Waseem Ahmad Naeem

Tak, przepraszam, że nigdy nie powróciłem do tego problemu po jego rozwiązaniu. Dodałem aktualizację do pytania z dodatkowym kontekstem. Dziękuję Ci!
— KMJungersen

Odpowiedzi:


20

najpierw app.UseRouting();więcapp.UseCors("foo");

Zmień Configuremetodę w następujący sposób:

public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
{
    if (env.IsDevelopment())
    {
        app.UseDeveloperExceptionPage();
    }

    app.UseHttpsRedirection();



    app.UseRouting();  // first
    // Use the CORS policy
    app.UseCors("foo"); // second

    app.UseAuthorization();

    app.UseEndpoints(endpoints =>
    {
        endpoints.MapControllers();
    });
}

To zadziałało dla mnie!


-Czy potrzebny jest pakiet nuget?
— chana

Pakiet nuget dla cors
— chana

1
@chana - nie trzeba instalować pakietu
— nuget

7
Utknąłem w tej sprawie na DAYS! nic z internetu nie działało. Twoje rozwiązanie w połączeniu z ConfigureServiceskodem OP rozwiązało mój problem. Wielkie dzięki!
— Tahreem Iqbal,

1
Miałem zatkany od wieków. Wielkie dzięki!
— Myles J

6

Interfejs API sieci Web jest używany app.UseHttpsRedirection(); które powodują CORSproblem, jeśli żądanie klienta nie jest httpsoparte. Aby więc użyć go z httpklientem, musimy skomentować lub usunąć tę linię.

Ten problem nie występuje CORS, https powoduje ten problem, ale zgłoszony błąd mówi, że dotyczy CORS.


Dziękuję człowieku. To rozwiązało mój problem
— Reagan Gallant

1
To jest poprawne! wiersz UseHttpsRedirection () musi znajdować się po UseCors ()
— Eric


0

Ponieważ używasz localhost as http://localhost:4200, spróbuj ustawić go w swojej konfiguracji:

public void ConfigureServices(IServiceCollection services)
{
    services.AddCors(options => options.AddPolicy("ApiCorsPolicy", build =>
    {                
        build.WithOrigins("http://localhost:4200")
             .AllowAnyMethod()
             .AllowAnyHeader();
        }));
        // ... other code is omitted for the brevity
     }
}

I Configuremetoda:

public void Configure(IApplicationBuilder app, IHostingEnvironment env, IServiceProvider provider)
{
    if (env.IsDevelopment())
    {
        app.UseDeveloperExceptionPage();
    }
    app.UseCors("ApiCorsPolicy");
    app.UseHttpsRedirection();
    app.UseAuthentication();
    app.UseMvc();
}

0

Dodając usługę Cors, pamiętaj o dodaniu .SetIsOriginAllowed((host) => true)po.WithOrigins("http://localhost:4200")

services.AddCors(options => {
            options.AddPolicy("mypolicy",builder => builder
            .WithOrigins("http://localhost:4200/")
            .SetIsOriginAllowed((host) => true)
            .AllowAnyMethod()
            .AllowAnyHeader());
  });

0

DLA .NET CORE 3.1

Najlepszym sposobem jest przechowywanie ścieżki źródłowej w pliku app.settings

"Origins": {
    "Server": "http://localhost:5001/",
    "Client": "http://localhost:4200/",
    "CorsOrigins": "http://localhost:4200,http://localhost:5001"
}

aw ConfigureServicesmetodzie zdefiniuj początki z sekcji konfiguracji

services.AddCors(
            options => options.AddPolicy(
                PolicyNames.AllowOrigins,
                builder => builder
                    .WithOrigins(
                        Configuration["Origins:CorsOrigins"]
                            .Split(",", StringSplitOptions.RemoveEmptyEntries)
                            .Select(s => s.TrimEnd('/'))
                            .ToArray()
                    )
                    .AllowAnyHeader()
                    .AllowAnyMethod()
                    .AllowCredentials()
            )
        );

Na koniec po prostu użyj corsa w Configuremetodzie (bez względu na kolejność użycia!)

app.UseCors(PolicyNames.AllowOrigins);     //Enable CORS!
Korzystając z naszej strony potwierdzasz, że przeczytałeś(-aś) i rozumiesz nasze zasady używania plików cookie i zasady ochrony prywatności.
Licensed under cc by-sa 3.0 with attribution required.