Проблеми з політикою CORS та .NET Core 3.1


11

Я не впевнений, чого мені не вистачає, але, здається, не можу отримати свою політику CORS, що працює з клієнтами .NET Core 3.1 та Angular 8.

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();
            });
        }

Повідомлення про помилку на стороні клієнта:

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.

ОНОВЛЕННЯ:

Хоча я була настройка CORS неправильно (і загальноприйнятий відповідь нижче і справді допомогти з цим) корінь питання НЕ був пов'язаний. Для додаткового контексту додаток працював цілком чудово при запуску програми API та Angular за допомогою CLI - у мене виникли проблеми лише після розгортання їх обох на веб-сервері.

«Фактична» проблема закінчилася тим , що був пов'язаний з з'єднанням SQL, який я тільки виявив після додавання плоско-файл реєстрації помилок в API і запустити трасування SQL Server , щоб знайти , що програма не може підключитися до SQL на всіх.

Я, як правило, очікував, що це лише поверне 500, і я зрозумів би проблему за 10 секунд - однак, неправильна конфігурація CORS означала, що 500 ніколи насправді не повертається, тому що проміжне програмне забезпечення CORS спочатку не вдалося. Це було дуже незручно сказати абсолютне найменше! . Однак я хочу додати, що тут на випадок, коли інші опиняються в цій ситуації, як я "переслідував неправильного кролика", якщо ви хочете. Після виправлення конфігурації CORS я зрозумів, що фактична проблема повністю не пов'язана з CORS.

TL; DR; - Іноді помилки на стороні сервера "Non-CORS" .NET можуть бути повернені як помилки CORS, якщо правила CORS не встановлені правильно

Список літератури:

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
спробуйте встановити app.UseCors("foo");ранішеapp.UseHttpsRedirection();
StepUp

@StepUp дякую за рекомендацію, але все одно не пощастило
KMJungersen

Ви вирішили свою проблему?
Крок

Хтось вирішив це питання? Чому відповідь не приймається?
Waseem Ahmad Naeem

Так, вибачте, що я жодного разу не звертався до цього питання після його вирішення. Я додав оновлення до питання з деяким додатковим контекстом. Дякую!
KMJungersen

Відповіді:


20

спочатку app.UseRouting();потімapp.UseCors("foo");

Змініть Configureметод таким чином:

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();
    });
}

Це працювало для мене!


-потрібний нут-пакет?
чана

nuget пакет для
корсів

1
@chana - вам не потрібно встановлювати пакет nuget
AbolfazlR

7
Я застряг у цьому питанні ДНИ! нічого з Інтернету не працювало. Ваше рішення в поєднанні з ConfigureServicesкодом OP вирішило мою проблему. Дуже дякую!
Тахрем Ікбал

1
Якби мене на віки тупали. Дуже дякую!
Myles J

6

Веб-API використовується app.UseHttpsRedirection(); які викликають CORSпроблему, якщо запит клієнта не httpsбазується. Отже, щоб використовувати його з httpклієнтом, нам потрібно прокоментувати або видалити цей рядок.

Цю проблему не має CORS, https викликає цю проблему, але викинута помилка говорить про це з CORS.


Спасибі людина. Це вирішило мою проблему
Рейган Галлант

1
Це правильно! рядок UseHttpsRedirection () повинен бути після UseCors ()
Ерік


0

Оскільки ви використовуєте localhost як http://localhost:4200, спробуйте встановити його у своїй конфігурації:

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
     }
}

І Configureспосіб:

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

0

Додаючи службу Cors, обов'язково включіть .SetIsOriginAllowed((host) => true)після.WithOrigins("http://localhost:4200")

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

0

ДЛЯ .NET CORE 3.1

Найкращий спосіб - це зберігати шлях вихідного файлу у файл app.settings

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

і в ConfigureServicesметоді визначають походження з розділу конфігурації

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

Нарешті, просто використовуйте cors у Configureметоді (незалежно від порядку використання!)

app.UseCors(PolicyNames.AllowOrigins);     //Enable CORS!
Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.