C# 响应中的“Access-Control-Allow-Credentials”标头为“”，当请求的凭据模式为“包含”时，该标头必须为“真”

Question

我在使用 .Net Core 6 时遇到了 Cors 的问题。尽管 Cors 可以与以前的 3.1 版本一起使用。 我搜索了很多没有用。

完整的错误信息是

Access to XMLHttpRequest at 'https://localhost:7230/api/teachers/subjectsByTeacher?teacherId=5&pageNo=1&pageSize=10&sorting=name%20asc' from origin 'https://localhost:3200' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: The value of the 'Access-Control-Allow-Credentials' header in the response is '' which must be 'true' when the request's credentials mode is 'include'. The credentials mode of requests initiated by the XMLHttpRequest is controlled by the withCredentials attribute.

这是我的 program.cs 类：

var builder = WebApplication.CreateBuilder(args);

// Configure cors.

string[] arrOrigins = { "https://localhost:3200", "http://localhost:3200" };

builder.Services.AddCors(options =>
{
    options.AddDefaultPolicy(corsBuilder =>
        corsBuilder.WithOrigins(arrOrigins)
                   .AllowAnyMethod()
                   .AllowAnyHeader());
});

builder.Services.AddControllers();
builder.Services.AddEndpointsApiExplorer();
builder.Services.AddSwaggerGen();
builder.Services.ConfigureDatabase(builder.Configuration);
builder.Services.AddScopedServices();
var app = builder.Build();

if (app.Environment.IsDevelopment())
{
    app.UseSwaggerAndSwaggerUI();
}

app.UseHttpsRedirection();
app.UseRouting();
app.UseCors();// Use Cors.
app.UseAuthorization();
app.MapControllers();

app.Run();

// 这样的后端方法。

[Route("api/[Controller]")]
[ApiController]
[Produces("application/json")]
public class TeachersController : ControllerBase
{
    private readonly ITeacherAppService _teacherAppService;

    public TeachersController(ITeacherAppService teacherAppService)
    {
        _teacherAppService = teacherAppService;
    }

    [HttpGet("SubjectsByTeacher")]
    public async Task<PagedResultDto<TeachersGroupsSubjectDto>> GetSubjectsByTeacherAsync(
        [FromQuery] TeacherSearchParams searchParams)
    {
        return await _teacherAppService.GetSubjectsByTeacherAsync(searchParams);
    }
}

public class TeacherSearchParams
{
    [Required]
    public int TeacherId { get; set; }
    public int PageNo { get; set; } = 1;
    public int PageSize { get; set; } = 10;
    public string Sorting { get; set; } = "id desc";
}

// 像这样的 Angular 方法。

getSubjectsByTeacher(): Observable<IPagedResultDto<TeacherGroupSubject>> {

let params = new HttpParams();
params = params.append("teacherId", "5");
params = params.append("pageNo", "1");
params = params.append("pageSize", "10");
params = params.append("sorting", "name asc");

const options = { params: params };

const fullUrl = `https://localhost:7230/api/teachers/subjectsByTeacher`;

return this.http.get<IPagedResultDto<TeacherGroupSubject>>(fullUrl, options)
  .pipe(map((response: IPagedResultDto<TeacherGroupSubject>) => {
    debugger;
    return response;
  }));
}

会有什么帮助吗？

Answer 1

最后，我得到了解决方案。 像这样在 Cors 配置中添加.AllowCredentials()方法。

请对问题和答案进行投票。 我花了 1 天的时间寻找问题的解决方案。

string[] arrOrigins = { "https://localhost:4200", "http://localhost:4200" };

builder.Services.AddCors(options =>
{
    options.AddDefaultPolicy(corsBuilder =>
        corsBuilder.WithOrigins(arrOrigins)
                   .AllowAnyMethod()
                   .AllowAnyHeader()
                   .AllowCredentials());
});