Angular 应用程序向 ASP .Net api 发送 POST 的 CORS 问题答案

【问题标题】：CORS problem on Angular app sending POST to ASP .Net apiAngular 应用程序向 ASP .Net api 发送 POST 的 CORS 问题
【发布时间】：2020-10-04 21:47:33
【问题描述】：

我正在尝试编写一个 agular 应用程序，它将向 ASP.NET Api 发出一些 http 请求。

这是我来自 Angular 的请求（托管在 http://localhost:4200）：

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

      let body = {
        "email": this.temail,
        "password": btoa(this.tepassword)
      }

      this.http.post<any>(environment.authUrl, body, this.httpOptions).subscribe(
        (data) => console.log(data),
        (err) => console.log(err)
      )

这是我在 ASP .Net Api 上的简单方法（监听 https://localhost:44317/）：

        [HttpPost]
    public HttpResponseMessage Auth([FromBody] User user)
    {
        return new HttpResponseMessage(HttpStatusCode.OK);
    }

我已经安装了 CORS nuget 并在配置文件中使用它：

       public static void Register(HttpConfiguration config)
    {
        // Web API configuration and services
        config.EnableCors();

我还为 Chrome 安装了 Allow CORS: Access-Control-Allow-Origin 扩展（虽然我使用 Edge 铬）。

每次我尝试从 Angular 向 ASP 发送 POST 请求时都会收到此错误：

Access to XMLHttpRequest at 'https://localhost:44317/api/user/' from origin 'http://localhost:4200' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: It does not have HTTP ok status.

有什么建议吗？

【问题讨论】：

在启动文件中配置cors的时候还需要配置domains to allow under，看这里。 docs.microsoft.com/en-us/aspnet/core/security/…

标签： angular asp.net-web-api

【解决方案1】：

Sajeetharan 的解决方案不起作用：

    using System;
using System.Collections.Generic;
using System.Linq;
using System.Web.Http;
using System.Web.Http.Cors;

namespace ApiAgenda
{
    public static class WebApiConfig
    {
        public static void Register(HttpConfiguration config)
        {
            // Web API configuration and services
            config.EnableCors(new EnableCorsAttribute("http://localhost:4200", headers: "*", methods: "*"));

            // Web API routes
            config.MapHttpAttributeRoutes();

            config.Routes.MapHttpRoute(
                name: "DefaultApi",
                routeTemplate: "api/{controller}/{id}",
                defaults: new { id = RouteParameter.Optional }
            );
        }
    }
}

我也在控制器上写了这个：

[EnableCors(origins: "http://localhost:4200/", headers: "", methods: "")]

对于 John Peters，我的 WebApiConfig.cs 最初是这样的：

    using System;
using System.Collections.Generic;
using System.Linq;
using System.Web.Http;

namespace ApiAgenda
{
    public static class WebApiConfig
    {
        public static void Register(HttpConfiguration config)
        {
            // Web API configuration and services
            config.EnableCors();

            // Web API routes
            config.MapHttpAttributeRoutes();

            config.Routes.MapHttpRoute(
                name: "DefaultApi",
                routeTemplate: "api/{controller}/{id}",
                defaults: new { id = RouteParameter.Optional }
            );
        }
    }
}

我不明白我需要如何修改它。

【讨论】：

【解决方案2】：

试试这个，

 config.EnableCors(new EnableCorsAttribute("http://localhost:4200", headers: "*", methods: "*"));

【讨论】：