从源“http://localhost:4200”访问“URL”处的 XMLHttpRequest 已被 CORS 策略阻止：答案

【问题标题】：Access to XMLHttpRequest at 'URL' from origin 'http://localhost:4200' has been blocked by CORS policy:从源“http://localhost:4200”访问“URL”处的 XMLHttpRequest 已被 CORS 策略阻止：
【发布时间】：2020-10-12 09:57:51
【问题描述】：

我以为我允许访问所有来源，但我仍然收到此错误。

在 'localhost:60248/api/page/1' 从源访问 XMLHttpRequest “http://localhost:4200”已被 CORS 策略阻止：跨源请求仅支持协议方案：http、data、chrome、 chrome 扩展，https。

UPDATE在添加建议的代码更改后，该错误现已更改。现在是这样的：

从 'http://localhost:60248/api/page/1' 访问 XMLHttpRequest 来源 'http://localhost:4200' 已被 CORS 策略阻止：对预检请求的响应未通过访问控制检查：预检请求不允许重定向。

在 Startup.cs 我有这个：

    public void ConfigureServices(IServiceCollection services)
    {
        services.AddCors(options =>
        {
            options.AddPolicy(name: "AllowAll",
                builder =>
                {
                    builder.AllowAnyOrigin()
                        .WithMethods("PUT", "DELETE", "GET");
                });
        });

在我的控制器中，我有这个：

[Route("api/[controller]")]
[ApiController]
public class PageController : ControllerBase
{
    ...

    [EnableCors("AllowAll")]
    [HttpGet("{id:int}")]
    public async Task<IActionResult> GetPageData(int id)
    {
       ...

这是调用端点的 Angular 服务：

export class PageContentService {
  constructor(private http: HttpClient) { }

  getContent(id: number): Observable<PageContent> {

    let headers = new HttpHeaders();
    headers = headers.set('Content-Type', 'application/json');
    const httpOptions = {
      headers: headers
    }

    return this.http.get<PageContent>(`http://localhost:60248/api/page/${id}`, httpOptions);
  }
}

我以为这样可以解决问题，但显然不是。

我还需要做什么？

【问题讨论】：

向我们展示您使用的 Javascript 代码 - 您是否使用了正确的 URL？ URL 是否有 http 或 https 前缀？
添加了调用端点的 Angular 服务。
您确定网址中没有奇怪的字符吗？错误消息指出您没有使用http。您是否设置了基本 URL？
有趣，我会调查一下...
请停止更改您的问题 - 它已被回答，您现在正在提出一个新问题。将其标记为已回答，因为花时间帮助您的人不是无限资源，应因提供帮助而获得奖励。

标签： c# asp.net-core-webapi asp.net-core-3.1

【解决方案1】：

我认为你还需要两件事：

就像 vivek 所说，在您的 Configure 方法中将 .UseCors() 添加到您的请求管道中。
将.AllowAnyHeader()添加到策略构建器中的CORS-Config，我认为Content-Type-Header默认是不允许的。

【讨论】：

您的意思是AllowAnyHeader()？我添加了这一点以及UseCors（参见更新的示例）。我现在收到一条略有不同的消息，结尾是：“对预检请求的响应未通过访问控制检查：预检请求不允许重定向。”
也添加 AllowAnyMethod()
我已经用新的错误信息更新了问题
@CompanyDroneFromSector7G 你不能一直更新问题——一旦你有答案，错误就会消失，那么这个问题就完成了。
@DavidG 错误略有改变，但仍然存在，所以问题没有解决。

【解决方案2】：

您还需要添加中间件。

public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
    {
...

        app.UseCors();

...
    }

【讨论】：

我不明白这里的反对意见，这似乎是 CORS 工作合乎逻辑的下一步。
@Squirrelkiller 同意，否决者请告诉我原因
我也是 - 我也不确定（投票赞成补偿）:(