【问题标题】:.NET Core 3.1 CORS not working on Ember (3.12) web UI.NET Core 3.1 CORS 不适用于 Ember (3.12) Web UI
【发布时间】:2020-06-14 08:07:22
【问题描述】:

我正在将 .NET Core Web API 从 2.2 迁移到 3.1。我已遵循 Microsoft 迁移说明,并在 UseRouting 和 UseEnpoints 之间调用了 CORS 中间件。但是,我仍然收到 CORS 错误。

在 ConfigureServices 方法中,我有:

services.AddCors();

在配置方法中,我有:

app.UseRouting();

app.UseCors(options => options
        .AllowAnyOrigin()
        .AllowAnyHeader().AllowAnyMethod()
    );

app.UseAuthentication();

app.UseEndpoints(endpoints =>
{
    endpoints.MapControllers();
});

网络浏览器中的控制台错误是:

跨域请求被阻止:同源策略不允许读取 http://localhost:5000/users/login 的远程资源。 (原因: CORS 标头“Access-Control-Allow-Origin”缺失)。

跨域请求被阻止:同源策略不允许读取 http://localhost:5000/users/login 的远程资源。 (原因: CORS 请求未成功)。

诊断:

我尝试遵循 Microsoft 的文档 Enable Cross-Origin Requests (CORS) in ASP.NET Core,但它使用了过时的引用,例如;使用 Mvc 和 IHostingEnvironment。

我尝试创建一个全新的 Web API 和 Ember Web-UI,但这也不起作用。可以找一个简单的例子getting-started-with-ember-js-and-net-core-3

知道是什么导致了问题吗?

理想的赏金奖励将用于有效的答案。最好在 Git 上发布一个工作的准系统项目。

注意:我现在允许任何来源,只是为了让它工作。最终,这将需要与http://localhost:4200 上的 Web-UI 一起使用

更新

收到的状态代码是 HTTP 405 - 方法不允许。有问题的方法是 OPTIONS 方法。

【问题讨论】:

  • 你检查响应的HTTP状态码了吗?您可以使用浏览器开发工具中的网络窗格进行检查。您是否确认这是 200 OK 成功响应,而不是 4xx 或 5xx 错误?
  • HTTP 错误为 405,方法不允许。我添加了AllowAnyMethod(),但没有成功。注意,我可以向后端提交 Postman 请求并获得 HTTP 200 响应。
  • 好的,那么听起来 405 错误是对 CORS 预检选项请求的响应。您可以检查浏览器开发工具中的网络窗格以确认。您应该看到列为 OPTIONS 的 HTTP 方法,而不是 POST 或 GET 或您的前端 JavaScript 代码尝试使用的任何方法。如果您的前端代码尝试将任何自定义标头添加到请求中,或者您的前端代码使用 GET、POST 或 HEAD 以外的 HTTP 方法,浏览器会发送 CORS 预检 OPTIONS 请求。
  • 如果 405 响应 CORS 预检 OPTIONS 请求,那么问题在于 http://localhost:5000/users/login 服务器未配置为允许 OPTIONS 请求。将该服务器配置为允许 OPTIONS 请求与服务器的 CORS 配置有所不同。您可以在 stackoverflow.com/a/43461131/441757stackoverflow.com/a/45623047/441757 的现有答案中找到 405 问题的解决方案。
  • 您可以在stackoverflow.com/a/43461131/441757stackoverflow.com/a/45623047/441757 的现有答案中找到405 问题的解决方案

标签: ember.js cors cross-domain ember-data asp.net-core-3.1


【解决方案1】:

.NET Core 2.2 到 3.0 的迁移文档是 incorrect。对UseCors(); 的调用需要放在UseRouting() 函数之前。我继续在UseHttpsRedirection() 之前添加了它,因为我在另一个站点的实现中看到了它。

https://docs.microsoft.com/en-us/aspnet/core/migration/22-to-30?view=aspnetcore-3.1&tabs=visual-studio#migrate-startupconfigure

在配置服务中

services.AddCors(options =>
{
    options.AddPolicy("CorsApiPolicy",
    builder =>
    {
        builder.WithOrigins("http://localhost:4200")
            .WithHeaders(new[] { "authorization", "content-type", "accept" })
            .WithMethods(new[] { "GET", "POST", "PUT", "DELETE", "OPTIONS" })
            ;
    });
});

在配置中

app.UseCors("CorsApiPolicy");

//app.UseHttpsRedirection(); 

app.UseJsonApi();

app.UseRouting();

app.UseAuthentication();

app.UseEndpoints(endpoints =>
{
    endpoints.MapControllers();
});

【讨论】:

  • 谢谢!!!微软你们杂种。又浪费了我生命中的 24 小时!
  • 当您在中间件中有一个全局策略时,这是最佳选择。但是当您想在特定控制器中使用另一个 CORS 策略时该怎么办?
  • 你应该为此发布一个问题。
猜你喜欢
  • 2020-05-05
  • 2020-04-27
  • 1970-01-01
  • 2021-09-19
  • 2020-07-30
  • 1970-01-01
  • 2020-04-22
  • 2016-06-04
  • 1970-01-01
相关资源
最近更新 更多