Aspire.StackExchange.Redis.OutputCaching cors error for cache data

Question

The Redis output cache in Aspire does not support policies. When I retrieve a cached response in my SPA application, I encounter a CORS error:

Request Details:

URL: url Method: GET Status Code: 200 OK Referrer Policy: strict-origin-when-cross-origin

Access to XMLHttpRequest at 'url' from origin 'url' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

I have already enabled the CORS policy in my application and don’t face any issues with other controller actions. Here's the relevant configuration:

const string policy = "CorsPolicy";
builder.Services.AddCors(options =>
{
    options.AddPolicy(policy, builder =>
    {
        builder.AllowAnyHeader();
        builder.AllowAnyMethod();
        builder.AllowAnyOrigin();
    });
});

var app = builder.Build();

app.UseOutputCache();

app.MapDefaultEndpoints();

app.UseMiddleware<BehaviorMiddleware>();

app.UseHttpsRedirection();
app.UseCors(policy);
app.UseAuthorization();

app.MapControllers();

app.Run();

    [HttpGet("")]
    [OutputCache(Duration = 120)]
    public async Task<IActionResult> GetVendors([FromQuery] GetUserCurrentGridModel query, CancellationToken cancellationToken = default){
    return Ok();
    }

Answer 1

According to your codes, this is related with how your CORS middleware executed, since the CORS middleware is executed after the cache middleware, which caused the issue.

You should make sure app.UseCors(policy); is called before app.UseOutputCache(), and then it will work well.

// Configure the HTTP request pipeline.

// Ensure CORS middleware is called first
app.UseCors(policy); 

// Call the output cache middleware after CORS
app.UseOutputCache();