No 'Access-Control-Allow-Origin' header is present on the requested resource CORS issue when hosted on IIS

Question

I have hosted next.js based frontend on iis. I have also hosted .net core based backend on IIS. If I use next.js based UI in above scenario, I see CORS issue when accessing backend APIS.

IF I use .net core using visual studio and run it there and then access next.js ui hosted on IIS then there is no CORS issue and it works fine.

How to fix this and why does it work with when run on visual studio ? The same APIs and exact same code, same machine, same IP and same ports Access to fetch at 'http://192.168.29.36:7547/api/Users/userLogin' from origin 'http://192.168.29.36:7501' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled

var builder = WebApplication.CreateBuilder(args);
builder.WebHost.UseUrls("http://0.0.0.0:7547");
// Add CORS policy
builder.Services.AddCors(options =>
{
 options.AddPolicy("AllowAllOrigins",
 builder =>
 {
 builder.AllowAnyOrigin()
 .AllowAnyMethod()
 .AllowAnyHeader();
 });
});
app.UseCors("AllowAllOrigins");

• browsermator: those are different ports there, 7547 and 7501. Localhosts with different ports are treated as separate domains. You can either use a browser profile with CORS rules turned off (in Chrome that's --disable-web-security) or run a proxy that serves frontend from same domain/port, or add that specific origin using CORS header (just remember to only do that for development) You've already done that here, but I'd avoid wildcards and double-check that OPTIONS verb is enabled and that app.UseCors call is in correct order. (Better to not set those response headers though)

Answer 1

According to your description, I suggest you could check your IIS to make sure you have set the IIS CORS module well.

I suggest you could try to use below codes inside the web.config

<configuration>
 <system.webServer>
 <modules>
 <remove name="CorsModule" />
 </modules>
 </system.webServer>
</configuration>

More details, you could refer to this article.