Web API 2.0 上的 COR 请求答案

【问题标题】：CORs Request on Web API 2.0Web API 2.0 上的 COR 请求
【发布时间】：2017-11-25 09:19:19
【问题描述】：

我在 Web API 和 Chrome 上启用了 COR，GET 和 POST 请求都失败了，但在 MS Edge 浏览器上，GET 请求没有问题，但是当我尝试 POST 请求时，它失败并显示两条错误消息控制台：

由于无效，服务器无法处理请求语法。

XMLHttpRequest：网络错误 0x80070005，访问被拒绝。

帖子的代码是一个启用跨域的标准Ajax请求：

$.ajax({
    type: "POST",
    crossDomain: true,
    url: 'http://localhost:50915/api/addjob',
    data: JSON.stringify(Job),
    contentType: "application/json;charset=utf-8",
    success: function (data, status, xhr) {
        alert("The result is : " + status + ": " + data);
    },
    error: function (xhr) {
        alert(xhr.responseText);
    }
});

在 Web API 端，我安装了 CORs Nuget 包并添加了以下内容以启用代码：

WebApiConfig.cs

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 }
            );

            var JsonFormatter = config.Formatters.OfType<JsonMediaTypeFormatter>().FirstOrDefault();
            if (JsonFormatter != null)
                JsonFormatter.SerializerSettings.ContractResolver = new CamelCasePropertyNamesContractResolver();
        }

和控制器：

[System.Web.Http.HttpPost]
[System.Web.Http.Route("api/addjob")]
[EnableCors(origins: "http://localhost", headers: "*", methods: "*")]
public void AddJob([FromBody] Job job)
{
    using (_tmsPortalDb)
    {
        _tmsPortalDb.Jobs.Add(job);
        _tmsPortalDb.SaveChanges();
    }
}

URL 都是 localhost，但在不同的端口上运行，它们都在同一个 VS 解决方案中作为单独的项目。我对 COR 支持的理解是，这应该可以解决本地主机调试的问题。有什么我错过的吗？

【问题讨论】：

只是一个疯狂的猜测：如果您添加 Web 应用程序主机的端口会怎样？ [EnableCors(origins: "http://localhost:SomeOthePort", headers: "*", methods: "*")]

标签： javascript c# ajax cors asp.net-web-api2

【解决方案1】：

如果托管在 IIS 中，请尝试使用以下内容。

     config.EnableCors(new EnableCorsAttribute("*", "*", "*") { SupportsCredentials = true });

对于 OWIN Hosted 下面是我使用 webapi 的 Angular 应用程序中的配置

 public class Startup {

    public void Configuration(IAppBuilder app) {

        AntiForgeryConfig.UniqueClaimTypeIdentifier = Constants.ClaimTypes.Subject;

        JwtSecurityTokenHandler.InboundClaimTypeMap.Clear();

        var config = new HttpConfiguration();
        app.UseCors(CorsOptions.AllowAll);

        //Middleware for security. This will introspect the incoming reference token
        IdentityServerBearerTokenAuthenticationOptions _options = new IdentityServerBearerTokenAuthenticationOptions {
            Authority = ConfigurationManager.AppSettings["IdentityServerURI"],
            ValidationMode = ValidationMode.ValidationEndpoint,
            RequiredScopes = new[] { "xxxxxadmin" },
            ClientId = "xxxxxadmin",
            ClientSecret = "api-secret",
            EnableValidationResultCache = true,
            ValidationResultCacheDuration =  TimeSpan.FromMinutes(10)                
        };

        app.UseIdentityServerBearerTokenAuthentication(_options);

        //Boots up the application
        Bootstraper.BootUp(config, app);
    }
}

【讨论】：