.NET Learning Notes: CORS and how to deal with it in developing

CORS
Cross-Origin Resource Sharing is a mechanism that uses HTTP headers to grant a web application running on one origin permission to reach selected resources in a different origin.The web application executes a cross-origin HTTP request when it requests a resource that has a different origin from its own, including domain, protocol, or port.

How to fix it in .NET
Bacause the frontend port in my VS Code always change, I can not hardcode origins.

var builder = WebApplication.CreateBuilder(args); // Add CORS service with dynamic origin checking builder.Services.AddCors(options => { options.AddPolicy("DynamicCors", policy => { policy .SetIsOriginAllowed(origin => origin.StartsWith("http://localhost:")) // allow all localhost ports .AllowAnyHeader() .AllowAnyMethod() .AllowCredentials(); // if you're sending cookies or auth headers }); }); var app = builder.Build(); // Enable the CORS middleware app.UseCors("DynamicCors"); app.UseAuthorization(); app.MapControllers(); app.Run(); 

Notes:

• SetIsOriginAllowed(origin => origin.StartsWith("http://localhost:")) lets any localhost port access your backend during development.

• Do not use AllowAnyOrigin() with AllowCredentials() — it's invalid per the CORS spec.

• This only applies during development. In production, you should restrict to known origins.