Asp.net WebApi - CORS 策略

Question

I have Asp.net web api project as a backend and react js as front-end I'm trying to make an api requests through my React to get or post data from or to the database using the api endpoints i created an the backend.

我第一次遇到 GET 和 POST 请求的 CORS 错误，然后我将其添加到我的 Web.config 文件中

<system.webServer>
  <httpProtocol>
     <customHeaders>
       <add name="Access-Control-Allow-Origin" value="*" />
       <add name="Access-Control-Allow-Methods" value="GET,PUT,POST,DELETE,OPTIONS" />
       <add name="Access-Control-Allow-Headers" value="Content-Type, Accept, Pragma, Cache-Control, Authorization " />
     </customHeaders>
   </httpProtocol>
  </system.webServer>

现在 GET 工作正常，但 POST 不工作

得到

public IHttpActionResult Get(string password)
        {
            if (password == "000")
            {
                using (DbModel dbModel = new DbModel())
                {
                    return Ok(dbModel.Provider_status.ToList());
                }
            }
            else
            {
                return null;
            }
        }

邮政

[HttpPost]
        public IHttpActionResult Post(List<Provider_status> rows)
        {
            try
            {
                using (DbModel dbModel = new DbModel())
                {
                    dbModel.Provider_status.AddRange(rows);
                    dbModel.SaveChanges();
                }
            }
            catch { }
            return Ok("record created");
        }

Answer 1

我已经实现了相同的但有多个来源的错误。 当我用逗号分隔多个来源时，我再次收到 CORs 错误。 所以我实现了自定义 CORS 策略提供程序。

我对 PUT 方法有同样的问题。 解决方案是自定义 CORS 策略提供程序。

[ EnableCors ] 属性实现ICorsPolicyProvider接口。 您可以通过创建派生自 Attribute 并实现ICorsPolicyProvider的 class 来提供自己的实现。

[AttributeUsage(AttributeTargets.Method | AttributeTargets.Class, AllowMultiple = false)]
public class MyCorsPolicyProvider : Attribute, ICorsPolicyProvider 
{
    private CorsPolicy _policy;

    public MyCorsPolicyProvider()
    {
        // Create a CORS policy.
        _policy = new CorsPolicy
        {
            AllowAnyMethod = true,
            AllowAnyHeader = true
        };

        // Add allowed origins.
        _policy.Origins.Add("http://myclient.azurewebsites.net");
        _policy.Origins.Add("http://www.contoso.com");
    }

    public Task<CorsPolicy> GetCorsPolicyAsync(HttpRequestMessage request)
    {
        return Task.FromResult(_policy);
    }
}

现在您可以将属性应用到您将放置 [ EnableCors ] 的任何位置。

[MyCorsPolicy]
public class TestController : ApiController
{
    .. //

例如，自定义 CORS 策略提供程序可以从配置文件中读取设置。

作为使用属性的替代方法，您可以注册创建ICorsPolicyProvider对象的ICorsPolicyProviderFactory object。

public class CorsPolicyFactory : ICorsPolicyProviderFactory
{
    ICorsPolicyProvider _provider = new MyCorsPolicyProvider();

    public ICorsPolicyProvider GetCorsPolicyProvider(HttpRequestMessage request)
    {
        return _provider;
    }
}

要设置ICorsPolicyProviderFactory ，请在启动时调用SetCorsPolicyProviderFactory扩展方法，如下所示：

public static class WebApiConfig
{
    public static void Register(HttpConfiguration config)
    {
        config.SetCorsPolicyProviderFactory(new CorsPolicyFactory());
        config.EnableCors();

        // ...
    }
}

它应该可以工作，但是在您的部署之后如果它不起作用，请在您的 web.config 中添加以下配置

<system.webServer>    
  <modules>    
    <remove name="WebDAVModule" />    
  </modules>    
  <handlers>    
    <remove name="WebDAV" />  
    <remove name="OPTIONSVerbHandler" />  
    <add name="OPTIONSVerbHandler" path="*" verb="OPTIONS" modules="ProtocolSupportModule" requireAccess="None" responseBufferLimit="4194304" />
  </handlers>    
</system.webServer>

部署后只需执行IISRESET或重新启动应用程序池

谢谢

Answer 2

安装 Cors package。

1. 安装包 Microsoft.AspNet.WebApi.Cors

2. 在您的 WebApiConfig 中启用 Cors

    {
        public static void Register(HttpConfiguration config)
        {
            // New code
            config.EnableCors();

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

3. 像这样装饰你的 controller

   [EnableCors(origins: "http://mywebclient.azurewebsites.net", headers: "*", methods: "*")]
    public class TestController : ApiController

来源： 微软文档