如何将字符串传递给 Angular 中的 post 请求？

Question

我进行了一些搜索，但似乎没有任何帮助。

我的 angular 看起来像这样，用户名是一个字符串。

getUser(username = null) {

if (username == null) {
  username = this.cookie.getCookieValue("username");
}
console.log(JSON.stringify({ username: username }));
console.log("passing in "+ username);

return this.http.post<User>(this.userBackendUrl + "/user", username, httpOptions).pipe(map(user => {
  console.log("Successfully got the user!");
  console.log(user);
  return user;
}));}

后端方法看起来像

public ActionResult GetUser(string username)
    {

我可以点击我的方法，但我在后端的用户名字符串始终为空。

Answer 1

根据请求发送字符串的方式，您必须执行以下操作：

作为纯字符串发送

如果您的 username 或字符串在请求中作为 纯字符串 发送，如下所示：

"testuser"

然后你可以将[FromBody]属性添加到控制器中的string参数，如下所示：

public ActionResult GetUser([FromBody] string username)
{
   //...
}

如果您的用户名或字符串未作为 "testuser" 发送，请将变量或字符串传递给 JSON.stringify 方法，如下所示：

return this.http.post<User>(this.userBackendUrl + "/user", JSON.stringify(username), httpOptions) //...

作为 JSON 对象发送

如果您的用户名或字符串在请求中作为 JSON 对象 发送，如下所示：

{
   username: "testuser"
}

然后您需要创建一个单独的 class（例如 DTO，GetUserRequest）tp 绑定，它应该如下所示：

public class GetUserRequest
{
   public string Username { get; set; }
}

稍后您可以将模型（您发送的 JSON 对象）绑定到此 class，再次提供 [FromBody] 属性和带有创建的 class 的参数作为数据类型，如下所示：

public ActionResult GetUser([FromBody] GetUserRequest user)
{
   //...
}

多个参数无需创建额外的class/DTO

正如 Lionel 在这里询问的那样，我知道有两种方法可以绑定到多个参数，而无需创建额外的 class 或 DTO。

不幸的是，据我所知，您不能将 [FromBody] 绑定到多个参数。

但是有以下两种方式：

以 url 编码形式发送数据

如果您发送数据形式 url 编码，您可以将 data/parameters 与 [FromForm] 属性绑定，如下所示：

以 url 编码形式发送数据：

username=test&email=test%40gmail.com&created=2018-08-07T15%3A02%3A00.736Z

使用 [FromForm] 属性绑定数据：

public ActionResult GetUser([FromForm] string username, [FromForm] string email, [FromForm] DateTime created)
{
   //...
}

将数据作为 JSON 对象发送并与 Newtonsoft 绑定

另一种方法是使用 Newtonsoft 的 JObject。我认为这种方式不太直观。

您可以将数据作为普通 JSON 对象发送，如下所示：

{   
   "username": "test",  
   "email": "test@gmail.com",   
   "created": "2018-08-07T14:53:54.639Z"
}

然后您将数据绑定到具有 [FromBody] 属性的单个 JObject，然后将数据绑定到单独的变量，如下所示：

public void GetUser([FromBody] JObject requestBody)
{
   string username = requestBody["username"].ToString();
   string email = requestBody["email"].ToString();
   DateTime created = requestBody["created"].ToObject<DateTime>();
}

Answer 2

像下面那样修改你的 c# 方法

    [Route("GetUser/{username}")]
    [HttpPost]
    public ActionResult GetUser(string username)
    {
       //code
    }

Answer 3

在 Angular 中作为表单数据发送：

const formData = new FormData();
formData.append("userName", userName);
return this.http.post<any>(url, formData);

并在ASP.NET中添加FromForm，参数名相同(userName):

public IActionResult GetUserName([FromForm] string userName) {

如何将字符串传递给 Angular 中的 post 请求？

How can I pass a string to a post request in Angular?

c#

asp.net-core

angular

angular4-httpclient

多个参数无需创建额外的class/DTO