webapi 之 post參數傳遞

最近在寫webapi，在寫post請求接口時遇到了不少的問題，在此記錄下來。

post請求的參數和get請求有點不一樣，我們知道get請求的參數是通過url來傳遞的，而post請求則是通過http的請求體中傳過來的，WebApi的post請求也需要從http的請求體里面去取參數。

單個參數錯誤寫法

               //錯誤的js ajax post寫法 $.ajax({ type:"post", url:"http://localhost:44670/IOF/test/Test1", data:{name:"張三豐"}, success:function(data,status){ console.log(data); console.log(status); } }); 

       //錯誤的webapi寫法 [HttpPost] public string Test1(string name) { return name; } 

上面的寫法看似很正確，實際上結果這這樣的

 

 

而且我們在asp.net webapi里打上斷點是無法跳轉到斷點的。

我們更改asp.net webapi(在參數中添加 [FromBody] )，如下

        [HttpPost]
        public string Test1([FromBody] string name) { return name; } 

我們仍然用上面的js來調用接口Test1
此時就可以看到程序跳轉到了斷點處，但是我們發現name是空值

 

 

單個參數正確寫法

//正確的js寫法 $.ajax({ type:"post", url:"http://localhost:44670/IOF/test/Test1", data:{"":"張三豐"}, success:function(data,status){ console.log(data); console.log(status); } }); 

//正確的webapi寫法 [HttpPost] public string Test1([FromBody] string name) { return name; } 

此時我們就看到Status Code是200OK了，webapi也拿到了傳遞過來的name值了

 

 

 

 

 

我們一般的通過url取參數的機制是鍵值對，即某一個key等於某一個value，而這里的FromBody和我們一般通過url取參數的機制則不同，它的機制是=value，沒有key的概念，並且如果你寫了key(比如ajax參數寫的{name:"張三豐"})，后台反而得到的name等於null。

---

上面是傳遞1個參數，那如果是多個呢？是不是ajax可以這樣寫{" ":"張三豐"，" ":"13200000000"}，后台可以這樣寫[FromBody] string name，[FromBody] string phone

多個參數錯誤寫法

//錯誤的寫法 $.ajax({ type:"post", url:"http://localhost:44670/IOF/test/Test1", data:{"":"張三豐","":"13200000000"}, success:function(data,status){ console.log(data); console.log(status); } }); 

//錯誤的寫法 [HttpPost] public string Test1([FromBody] string name, [FromBody] string phone) { return name + "：" + phone; } 

 

 

說明這樣是行不通的。

多個參數正確寫法

//正確寫法 $.ajax({ type:"post", url:"http://localhost:44670/IOF/test/Test1", data:{name:"張三豐",phone:"13200000000"}, success:function(data,status){ console.log(data); console.log(status); } }); 

//test：新建一個類如包涵所有的參數 public class test { private string name; private string phone; public string Name { get{return name;} set{ name = value;} } public string Phone { get{return phone;} set{phone = value;} } } 

//正確寫法 [HttpPost] public string Test1([FromBody] test model) { return model.Name; } 

 

 

 

 

---

如果我們的webapi都是post，而且每個都是多個參數，那豈不是要創建很多的類來接收post過來的值？作為一個愛偷懶的程序員，那怎么可以！！

最優寫法

// JSON.stringify()：這個函數的作用主要是為了序列化對象的。 $.ajax({ type:"post", url:"http://localhost:44670/IOF/test/Test1", contentType: 'application/json', data:JSON.stringify({name:"張三豐",phone:"13200000000"}), success:function(data,status){ console.log(data); console.log(status); } }); 

//webapi 要換個寫法，dynamic：序列化 [HttpPost] public string Test1(dynamic obj) { return obj.name; } 

我們把js要傳遞的參數序列化，然后通過后來dynamic來接收序列化的值。

 

 

總結

以上就是post請求參數傳遞的幾種方法，推薦使用最好一種【最優寫法】。

轉自：https://www.jianshu.com/p/26999e75cfba