asp.net - Angular2 HTTP 后 ASP.NET MVC Web API

Question

如何使用 Angular2 正确创建复杂对象或多个参数的 Web API POST？

我在 Angular2 中有一个服务组件，如下所示:

public signin(inputEmail: string, inputPassword: string): Observable<Response> {
    return this.http.post('/api/account/signin', JSON.stringify({ Email: inputEmail, Password: inputPassword}), this.options);
}

目标 web api 如下所示:

[HttpPost]
[Route("signin")]
public async Task<IActionResult> Signin(string email, string password)
{
       ....
}

这不起作用，因为我需要将 web api 的参数转换为具有电子邮件和密码属性的单个 POCO 类实体，并放置 [FromBody] 属性:Signin([FromBody] Credential credential)

在不使用 [FromURI](带有查询字符串的 POST 请求？)的情况下，如何在不将这些参数转换为单个 POCO 类的情况下对多个参数或复杂对象进行 POST？

因为如果我有许多带有参数的 Web API POST 操作，如 (string sensitiveInfo1, string name, int sensitiveInfo2) 或 (ClassifiedInfo info, string sensitiveInfo1, string sensitiveInfo2)，我是否需要将它们全部转换为 POCO 类并始终使用 [FromBody]？

附言。 我之前使用过 RestangularJS，它可以发布任何东西(多个原始对象和复杂对象)，而无需我的 Web API 操作具有 [FromBody] 属性。将研究 RestangularJS 是如何做到的。

Answer 1

Without using [FromURI] (POST requests with query strings?), how can I make POSTs of multiple parameters or complex objects without converting these parameters into a single POCO class?

我知道这不是您想听到的，但开箱即用是不可能的。这不是发出请求的浏览器代码的限制。这意味着无论您使用的是 Angular、JQuery、纯 JavaScript，还是 RestangularJS，都没有关系。这是 Web API(任何版本)的限制(我随意使用这个词，因为我确信这是设计使然)。这是有关此设计的文档:Parameter Binding in ASP.NET Web API迈克·沃森 (Mike Wasson)。

At most one parameter is allowed to read from the message body. So this will not work:

// Caution: Will not work!
public HttpResponseMessage Post([FromBody] int id, [FromBody] string name) { ... }

那么问题就变成了，您有哪些选择？

创建模型

这是您试图避免的事情，但我首先列出它，因为这是 Web API 的预期行为方式。我还没有听到一个令人信服的理由不这样做。这种方法允许您轻松扩展模型而无需更改方法签名。它还允许对模型本身进行模型验证。我个人非常喜欢这种方法。

public class SignInModel{
    public string Email {get;set;}
    public string Password {get;set;}
}

[HttpPost]
[Route("signin")]
public async Task<IActionResult> Signin(SignInModel signInModel)
{
       // ....
}

我没有重复您现有的 JavaScript 代码，因为您所拥有的与上面的 Web API 代码一样工作

网址

再一次，你试图避免什么。这确实使您想要的成为可能，但限制是您必须使用 URL 上的查询字符串传递这些参数。 JavaScript 会更改，但您在 Web API 方法上的签名不会。

public signin(inputEmail: string, inputPassword: string): Observable<Response> {
    return this.http.post('/api/account/signin/?email=inputEmail&password=inputPassword', null, this.options);
}

我没有重复您现有的 Web API 代码，因为您所拥有的与上面的 Web JavaScript 代码一样工作(我相信默认情况下假定 FromUri)

自定义模型绑定(bind)器

参见 Passing multiple POST parameters to Web API Controller Methods里克斯特拉尔。此选项允许您创建一个自定义模型 Binder ，该 Binder 可以满足您的要求。这是一大堆额外的代码，恕我直言，并没有太大好处。也许在某些情况下它会很有用，尽管我真的想不出有什么。

动态

最后，您还可以传入一个 dynamic 对象作为 Web API 的参数。这本质上与接收 JSON 作为字符串并让您的 Controller 代码负责内容的反序列化相同。同样，我相信这会使您的代码在大多数情况下变得更糟，因为您必须实现自定义验证和类型检查。提出了这个答案previously on SO by Bes Ley .同样，也许在某些情况下它会很有用，尽管我真的想不出有什么用。