I have been stuck on this issue for days. I’m attempting to add a CORS policy so my application does not require a CORS plugin (extension) to run. I’ve went through multiple tutorials of how to correctly implement the add policy and how to order the middleware. My application backend should send map data to the front end but without the plugin I receive the infamous
Access to XMLHttpRequest at 'http://localhost:5001/maps/NaturalEarthII/tilemapresource.xml' from origin 'http://localhost:4200' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
error. From my understanding everything is setup as it should be but the results are not agreeing, Please help! There is no controllers
ConfigureServices method:
public void ConfigureServices(IServiceCollection services)
{
// Enable Gzip Response Compression for SRTM terrain data
services.AddResponseCompression(options =>
{
options.EnableForHttps = true;
options.MimeTypes = ResponseCompressionDefaults.MimeTypes.Concat(
new[] { "application/vnd.quantized-mesh" });
options.Providers.Add<GzipCompressionProvider>();
});
// Add CORS Service so Tile Server works
services.AddCors(options =>
{
//Here ive attepted implementing default and specific policy
//I've also tried only allowing specific origins and allowing any method + header
//no luck. I will change this to be more specific once i get maps to show
options.AddDefaultPolicy(
builder => builder.AllowAnyOrigin()
);
options.AddPolicy("allowAny",
builder => builder.WithOrigins("http://localhost:5001")
.SetIsOriginAllowed((host) => true)
.AllowAnyMethod().AllowAnyHeader()
);
});
services.AddControllers();
//services.AddSpaStaticFiles(config => config.RootPath = "wwwroot");
services.AddSingleton(typeof(MessageBus), new MessageBus());
}
Configure method:
public void Configure(IApplicationBuilder app, IWebHostEnvironment env, Microsoft.Extensions.Hosting.IHostApplicationLifetime applicationLifetime)
{
applicationLifetime.ApplicationStopping.Register(OnShutdown);
if (env.IsDevelopment())
{
app.UseDeveloperExceptionPage();
}
// Use Gzip Response Compression for SRTM terrain data
app.UseResponseCompression();
// We must set the Content-Type and Content-Encoding for SRTM terrain files,
// so the Client's Web Browser can display them.
app.Map("/terrain/srtm", fileApp =>
{
fileApp.Run(context =>
{
if (context.Request.Path.Value.EndsWith(".terrain")) {
context.Response.Headers["Content-Type"] = "application/vnd.quantized- mesh";
context.Response.Headers["Content-Encoding"] = "gzip";
}
return context.Response.SendFileAsync(
Path.Combine(Directory.GetCurrentDirectory(), ("data/terrain/srtm/" + context.Request.Path.Value)));
});
});
Console.WriteLine(Path.Combine(Directory.GetCurrentDirectory() + "data"));
// Make the data/maps directory available to clients
app.UseStaticFiles(new StaticFileOptions
{
FileProvider = new PhysicalFileProvider(
Path.Combine(Directory.GetCurrentDirectory(), "data")),
});
app.UseRouting();
//Add the default policy thats create in the conf services method
app.UseCors();
app.UseAuthorization();
app.UseWebSockets();
app.UseEndpoints(endpoints => endpoints.MapControllers().RequireCors("allowAny"));
bus = (MessageBus)app.ApplicationServices.GetService(typeof(MessageBus));
...
In the Add cors Ive attempted implementing default and specific policy
I’ve also tried only allowing specific origins and allowing any method + header. No luck. I will change this to be more specific once i get maps to show
services.AddCors(options =>
{
options.AddDefaultPolicy(
builder => builder.AllowAnyOrigin()
);
options.AddPolicy("allowAny",
builder => builder.WithOrigins("http://localhost:5001")
.SetIsOriginAllowed((host) => true)
.AllowAnyMethod().AllowAnyHeader()
);
});
2
Answers
After trying endless attempts at making the back end work I gave up and implemented a reverse proxy on the front end. I can now use my web application without a CORS plugin.
proxy.conf.json:
angular.json:
You are setting your allowed origin to be the service itself rather than address of your UI.
In your case your origin should be
http://localhost:4200
not5001
Add this to your
program.cs
Do note that the
UseCors()
needs to be called beforeUseAuthentication()
andUseAuthorization()
I also can’t see where you are calling your
ConfigureServices
method