How add CORS to .net core 3.1 controller?

Question

I'm developing a vue3 application on my computer and I have a .net core 3.1 Controller API on the same machine that I start up and it starts on https://localhost:44347 and the vue-app starts at http://localhost:8080.

So when I call a method on the Controller API I get the classic: "Access to XMLHttpRequest at 'https://localhost:44347/api/user/whoAmI/null' from origin 'http://localhost:8080' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource"

So, I've read a few articles, that are very clear, on how to allow CORS on my Controller API. But whever I do I still get the same error from my vue3 webpage. Below are my "Configure" and "ConfigureServices" methods. I've tried moving the "AddCors" around a bit in both methods. I read somewhere that it has to be before "UseMvc" but regardless I still get the same error. I'm in serious need of help so all thoughts are welcome. (I also tried adding the "devServer" directive to the vue.config.js but it wouldn't apply no matter what.. )

public void ConfigureServices(IServiceCollection services)
{

//services.AddCors(options =>
//{
//    options.AddPolicy(_corsPolicy,
//        policy =>
//        {
//            policy
//            .AllowAnyOrigin()
//            .AllowAnyHeader()
//            .AllowAnyMethod();
//        });
//});

services.AddCors();

services.AddMvc(option => option.EnableEndpointRouting = false)
    .AddNewtonsoftJson();

services.Configure<CookiePolicyOptions>(options =>
{
    // This lambda determines whether user consent for non-essential cookies is needed for a given request.
    options.CheckConsentNeeded = context => true;
    options.MinimumSameSitePolicy = SameSiteMode.None;
});

services.Configure<IISOptions>(options =>
{
    //options.AuthenticationDescriptions holds a list of allowed authentication schemes
    options.AutomaticAuthentication = true;
    options.ForwardClientCertificate = true;
});

services.AddHttpContextAccessor();
services.Configure<SettingModel>(Configuration.GetSection("Configurations"));
services.Configure<Urls>(Configuration.GetSection("Urls"));

#region AddScopedAndSingletons

#endregion
}

 public void Configure(IApplicationBuilder app, IHostEnvironment env)
{
 if (env.IsDevelopment())
 {
     app.UseDeveloperExceptionPage();
     // Webpack initialization with hot-reload.
     app.UseWebpackDevMiddleware(new WebpackDevMiddlewareOptions
     {
         HotModuleReplacement = true,
     });
 }
 else
 {
     app.UseExceptionHandler("/Home/Error");
 }
 app.UseStaticFiles();
 app.UseCors(options =>
 options.AllowAnyOrigin().AllowAnyMethod()
 );

 app.UseMvc(routes =>
 {
     routes.MapRoute(
         name: "default",
         template: "{controller=Home}/{action=Index}/{id?}");

     routes.MapSpaFallbackRoute(
         name: "spa-fallback",
         defaults: new { controller = "Home", action = "Index" });
 });

}

Answer 1

I've tried all thinkable (for me) variants of adding cors to my project and absolutely nothing worked. Then, we just instead created a .net 7 webapi project and moved all our code to that one and then it worked on the first try. The same code..

Can't but think it's a bug in .net core 3.1...