VS2017 Web应用程序CORS：访问控制允许来源

Question

我正在将Angular 6+用于一个小型网站，向CRUD展示一个SQL Database。我知道Angular是client-side framework，所以我使用Visual Studio 2017创建了一个Web服务，我使用的项目是web application ASP.NET Core，并且由于我正在{{1 }}，localhost在Angular上运行，我的服务当前在4200 port

上

由于此，我已经（或最后尝试过）通过在port 53819上安装CORS NUGget软件包并在控制器级别启用它来启用Cross-Origin Resource Sharing (CORS)，如下所示：

webservice

在我的... namespace CIE_webservice.Controllers { [Produces("application/json")] [Route("api/CIE")] [EnableCors(origins: "http://localhost:4200/", headers: "*", methods: "*")] public class CIEController : Controller { [HttpGet] public IEnumerable<string> Get() { return new string[] { "value1", "value2" }; } ... 上，我正在使用一个简单的Angular App请求，如下所示：

ajax

据我所知，我的代码还可以，但是仍然出现错误：

$.ajax({
      url: 'http://localhost:53819/api/CIE/',
      success: function() {  console.log(" OK "); },
      error: function() {  console.log(" Error "); }
  });

即使Ajax请求的响应为200 OK，预览也会向我显示响应json：

也许我错过了一些东西，或者我对这个概念的理解不佳...如果需要更多信息来解决我的案件，请随时提出询问。

谢谢。

Answer 1

我在一个业余项目中也有类似的工作，所以我可以向您展示如何使它工作...

我是在Startup.cs中完成的

app.UseCors(options => options.WithOrigins(Configuration["trustedCors"].Split(' ')).AllowAnyMethod().AllowAnyHeader());

将其保存在我的配置文件中...

“ trustedCors”：“ http://localhost:60000 https://localhost:60000 http://glendesktop:60000 https://glendesktop:60000”

我还从测试中记得那个案例对于CORS很重要。

Answer 2

根据格伦的回答和这个“ tutorial”，我设法使事情开始起作用。

在我的Startup.cs文件上

...
public void ConfigureServices(IServiceCollection services) {
  services.AddCors();       /* <----- Added this line before de MVC */
  services.AddMvc();
}
...
public void Configure(IApplicationBuilder app, IHostingEnvironment env) {
  if (env.IsDevelopment()) {
    app.UseDeveloperExceptionPage();
  }
  app.UseCors(builder => builder.WithOrigins("http://localhost:4200")); /* <----- Added this line before de MVC */
  app.UseMvc();
}

在我的控制器文件CIEController.cs

中

...    
namespace CIE_webservice.Controllers {
  [Produces("application/json")]
  [Route("api/CIE")]
  [EnableCors(origins: "http://localhost:4200/", headers: "*", methods: "*")] /* <--- This line remains here or can be added at the action level*/
  public class CIEController : Controller {
    [HttpGet]
    public IEnumerable<string> Get() {
      return new string[] { "value1", "value2" };
    }
...