重点：POST 和 GET 的区别
- GET：参数写在
params，拼在URL地址栏- POST：参数写在
data，放在请求体里面
后端 ASP.NET MVC 代码（加上 [HttpPost] 标记）
[HttpPost]
public ActionResult User(int id)
{
return Json(new { user = "bamn.cn：" + id }, JsonRequestBehavior.AllowGet);
}
Code language: PHP (php)注意：这里后端直接接收 int id，默认无法直接拿到axios传的data里的ID。 因为axios POST默认提交JSON格式，MVC简单参数接收默认是表单格式。 两种解决方案：
- 后端改成实体类接收JSON（推荐）
- axios把参数转为表单格式（
Qs.stringify）
HTML完整页面代码
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>例子</title>
<script src="~/Scripts/jquery-1.10.2.min.js"></script>
<script src="~/Scripts/axios.js"></script>
</head>
<body>
<div id="name"></div>
<script>
$(function () {
// 注：post请求有的后端要求参数为formdata格式，此时需要借助 Qs.stringify()方法将对象转换为字符串
axios({
method: 'post',
url: '/home/user',
// 传递json参数，放在请求体data
data: { ID: 123 ,name:'222'},
// 设置请求头信息
headers: {
//token: '123'
},
responseType: 'json'
}).then(response => {
// 请求成功
let res = response.data;
$("#name").text(res.user);
}).catch(error => {
// 请求失败
console.log(error);
});
});
</script>
</body>
</html>
Code language: HTML, XML (xml)两种POST传参方式
方式1：提交JSON（axios默认）
- 请求头：
Content-Type: application/json - JS代码：直接写
data:{ID:123,name:'222'} - 后端MVC需要新建实体类接收
public class UserModel
{
public int ID { get; set; }
public string name { get; set; }
}
[HttpPost]
public ActionResult User(UserModel model)
{
return Json(new { user = "bamn.cn：" + model.ID }, JsonRequestBehavior.AllowGet);
}
Code language: JavaScript (javascript)方式2：表单格式 x-www-form-urlencoded（老后端常用）
需要引入 qs 库，使用 Qs.stringify() 转换对象
data: Qs.stringify({ ID: 123 ,name:'222'})
Code language: CSS (css)请求头自动变成：Content-Type: application/x-www-form-urlencoded 此时后端就可以直接用简单参数 int id 接收。
POST简写语法
axios.post('/home/user', {ID:123,name:'222'})
.then(res=>{
$("#name").text(res.data.user);
})
.catch(err=>{
console.log(err);
})
Code language: JavaScript (javascript)
Previous: Axios 简介、安装与 GET/POST 请求示例
Next: Axios带Headers的请求方式