axios 访问data类型和.net core 后端对应接收
一、关于get和post方法采用的参数类型
1、get用到的data类型一般为query和params,由于请求url有最大限制,常用于参数和参数值比较小的场景,也是比较常用的场景。
data类型:query是拼接参数紧接到url后面,
axios.get('/api/data?param1=value1¶m2=value2')
.then(response => {
// 处理响应
})
.catch(error => {
// 处理错误
});
params是 参数单独放在查询参数的params里面
axios.get('/api/data', {
params: {
param1: 'value1',
param2: 'value2'
}
})
.then(response => {
// 处理响应
})
.catch(error => {
// 处理错误
});
对应的后端代参数为[FromQuery]码如下:
[HttpGet]
public IActionResult Get(string param1, string param2)
{
// 你的逻辑
return Ok(new { param1, param2 });
}
二、post方法常用于数据量大的场景,常用的data类型分别是data和params
需要内容形式为'Content-Type': 'multipart/form-data'和FormData结合使用,在网页里显示的位置也不一样,可以结合使用
1、当data类型为params时,携带查询参数值
let formData = new FormData();
formData.append('key1','value1');
formData.append('key2','value2');
axios.post('/api', {
headers: {
'Content-Type': 'multipart/form-data'
},
params:formData
})
.then(response => {
// 请求成功处理逻辑
})
.catch(error => {
// 请求失败处理逻辑
});
对应后端数据参数需要加上FromForm
[HttpGet]
public IActionResult api([FromForm]string param1, [FromForm]string param2)
{
// 你的逻辑
return Ok(new { param1, param2 });
}
2.当data为data时,发送数据
let formData = new FormData();
formData.append('key1','value1');
formData.append('key2','value2');
axios.post('/api', {
headers: {
'Content-Type': 'multipart/form-data'
},
data:formData
})
.then(response => {
// 请求成功处理逻辑
})
.catch(error => {
// 请求失败处理逻辑
});
[HttpGet]
public IActionResult api([FromForm]string param1, [FromForm]string param2)
{
// 你的逻辑
return Ok(new { param1, param2 });
}
3.FromForm和FromBody的用法区别:前者是明确的参数值类型,后者则是不需要明确的参数值类型,常用做对象