如何將字符串傳遞給 Angular 中的 post 請求？

Question

我做了一些搜索，似乎沒有任何幫助。

我的角度看起來像這樣，用戶名是一個字符串。

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"
}

然后你需要創建一個單獨的類（一個 DTO，例如GetUserRequest ）tp 綁定到，它應該是這樣的：

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

稍后您可以將模型（您發送的 JSON 對象）綁定到這個類，再次提供[FromBody]屬性和一個參數，並將創建的類作為數據類型，如下所示：

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

---

多個參數無需創建額外的類/DTO

正如萊昂內爾在這里問的那樣，我知道如何在不創建額外類或 DTO 的情況下綁定到多個參數的兩種方法。

不幸的是， [FromBody]我所知，您無法將[FromBody]綁定到多個參數。

但是有以下兩種方式：

以表單 url 編碼的形式發送數據

如果您發送經過 url 編碼的數據表單，您可以使用[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

Angular中的Request返回一個可觀察的結果，如果您想獲得響應，請訂閱您的請求來代替管道調用，例如：

this.http.post<User>(...).subscribe(res => console.log(res));

服務器處理完請求后，響應將通過訂閱參數“ res”傳遞。

Answer 3

修改你的 c# 方法，如下所示

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

Answer 4

在 Angular 中作為表單數據發送：

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

並在 ASP.NET 中添加FromForm ，使用相同的參數名稱（用戶名）：

public IActionResult GetUserName([FromForm] string userName) {