javascript - 在 AngularJS 中使用 POST 到 .net Web API 时出错

Question

我目前在使用 AngularJS 和 .net WebAPI 时遇到问题。 我可以通过我的 WebAPI 成功获取内容或对象，但我目前在发布数据时遇到问题。

我尝试发布内容时遇到的错误如下:

OPTIONS http://localhost:18130/api/Products XMLHttpRequest cannot load

http://localhost:18130/api/Products. Response for preflight has invalid HTTP status code 405

请记住，当我尝试使用 Fiddler 发帖时，它工作得非常好，没有任何问题。

以下是我用来发布的 AngularJS 代码:

var data = { "Title": $scope.title, "Description": $scope.description };

$http.post(
    'http://localhost:18130/api/Products',
     JSON.stringify(data), {
         headers: {
             'Content-Type': 'application/json; charset=UTF-8'
          }
      }).success(function (data) {
          console.log(data);
      });

有人可以指导我正确的方向吗？ WebApi 和 AngularJS 应用程序都在不同的域中，这是 CORS 问题吗？发帖时如何解决问题。

提前致谢。

Answer 1

根据您在创建 Web API 项目时使用的模板，它可能使用也可能不使用 OWIN。 假设是(如果不是，scniro 的另一个答案将是一个投注起点):

当我从 js 应用程序发布到 web api 时，我遇到了类似的问题。我从 nuget 安装了 Microsoft.Owin.Cors，并在我的 Startup.cs 中添加了:

    public void Configuration(IAppBuilder app) {
        app.UseCors(new CorsOptions {
            PolicyProvider = new CorsPolicyProvider {
                PolicyResolver = context => {
                    CorsPolicy result = new CorsPolicy {
                        AllowAnyHeader = true,
                        AllowAnyMethod = true,
                        AllowAnyOrigin = true,
                        SupportsCredentials = true
                    };                        
                    return Task.FromResult(result);
                }
            }
        });
    }

这将允许一切。在生产中，您可以将其更改为仅允许来自您允许的来源的请求，如下所示:

    public void Configuration(IAppBuilder app) {
        app.UseCors(new CorsOptions {
            PolicyProvider = new CorsPolicyProvider {
                PolicyResolver = context => {
                    CorsPolicy result = new CorsPolicy {
                        AllowAnyHeader = true,
                        AllowAnyMethod = true,
                        AllowAnyOrigin = false,
                        SupportsCredentials = true
                    };
                    result.Origins.Add(ConfigurationManager.AppSettings.Get("YourAllowedUrl"));
                    return Task.FromResult(result);
                }
            }
        });
    }

希望这对您有所帮助。