asp.net core - Setting up CORS - browser shows "No 'Access-Control-Allow-Origin' header is present&

admin管理员组

文章数量:1182734

In my ASP.NET Core App I have the following:

builder.Services.AddCors(options =>
{
    options.AddDefaultPolicy(policy =>
    {
        policy.AllowAnyOrigin()
              .AllowAnyMethod()
              .AllowAnyHeader();
    });
});

var app = builder.Build();
app.UseCors();

Now my frontend app is sending a POST request to a different domain and a browser initiates an OPTIONS preflight request (all expected). In the network tab I see an options successful OPTIONS request with all the expected headers:

• Access-Control-Allow-Headers: <...>
• Access-Control-Allow- Methods: <...>
• Access-Control-Allow-Origin: *

But the browser is blocking an actual POST request with the error:

Access to fetch at 'https://<...>' from origin 'https://<...>' 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.

I might be going mad, but how is this possible? I promise 200 bounty to someone who helps me solve the issue

In my ASP.NET Core App I have the following:

builder.Services.AddCors(options =>
{
    options.AddDefaultPolicy(policy =>
    {
        policy.AllowAnyOrigin()
              .AllowAnyMethod()
              .AllowAnyHeader();
    });
});

var app = builder.Build();
app.UseCors();

Now my frontend app is sending a POST request to a different domain and a browser initiates an OPTIONS preflight request (all expected). In the network tab I see an options successful OPTIONS request with all the expected headers:

• Access-Control-Allow-Headers: <...>
• Access-Control-Allow- Methods: <...>
• Access-Control-Allow-Origin: *

But the browser is blocking an actual POST request with the error:

Access to fetch at 'https://<...>' from origin 'https://<...>' 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.

I might be going mad, but how is this possible? I promise 200 bounty to someone who helps me solve the issue

• asp.net-core
• cors

Share Improve this question Follow edited Jan 27 at 8:23 Jason Pan 21.8k22 gold badges1919 silver badges4242 bronze badges asked Jan 26 at 19:35 eddyP23eddyP23 7,0251111 gold badges5757 silver badges9898 bronze badges 4

• Hi eddyP23, please try to use builder.AllowAnyMethod() .SetIsOriginAllowed(_ => true) .AllowAnyHeader() .AllowCredentials();. Here is the link, you can check it. – Jason Pan Commented Jan 27 at 8:20
• It's difficult to tell when all of the URLs and details are redacted but a fairly common mistake is setting up the CORS settings on the server which serves the website pages rather than the server which has the resources the website is trying to reach. – Damien_The_Unbeliever Commented Jan 27 at 8:53
• Seems you are using custom middleware(I found there is a Request-Context: appId:), may I know what is it ? The cors setting in asp.net core is correct, but it fails in your side, if you want to address the issue, you need to share Program.cs file(please hide sensitive data if any). – Jason Pan Commented Jan 27 at 9:27
• And I also find you are using Kesrel server, did you deploy the application in linux machine or running in vs2022 ? – Jason Pan Commented Jan 27 at 9:29

Add a comment  | 

2 Answers 2

Sorted by: Reset to default 1

The error message says the header is missing from the requested resource.

The screenshot you are showing is the response to the preflight.

The header needs to be on both the preflight response and the resource response.

This CORS policy allows any origin, method, and header. This is suitable for development or public APIs where security is not a concern.

  builder.Services.AddCors(options =>
    {
        options.AddPolicy("AllowAll", builder =>
        {
            builder.AllowAnyOrigin()
                .AllowAnyMethod()
                .AllowAnyHeader();
        });
    }); 
    var app = builder.Build();
    app.UseCors("AllowAll");

if sercurity is needed can use like this

builder.Services.AddCors(options =>
{
    options.AddPolicy("AllowSpecificOrigin",builder =>
        {
           builder.WithOrigins("http://localhost:3000", "http://192.168.1.111:3000")
                   .AllowAnyHeader()                   
                   .AllowAnyMethod()
                   .AllowCredentials();
       });
});
app.UseCors("AllowSpecificOrigin");

in controller

[EnableCors("AllowSpecificOrigin")]
[Route("api/[controller]")]
[ApiController]
public class YourController : Controller
{}

本文标签：