简单介绍
-
前端传递文件参数的时候,通常会使用POST方式传参,将请求header的content-type设置为:multipart/form-data(因为 GET 请求只能传递文本类型的参数,而文件属于二进制数据,无法直接通过 GET 方式传递。)
-
前端通过POST传参时,header的content-type设置为"application/json"
-
前端通过GET方法传递参数时,一般不会使用 Content-Type 请求头,因为 GET 请求的参数是通过 URL 中的查询字符串参数来传递的,不需要使用 Content-Type 请求头来表示参数的类型
-
后端接收POST请求请求:参数为JSON对象时,使用@RequestBody 注解标识
-
后端接收POST请求:参数为文件时,使用(@RequestParam("file") MultipartFile file),(@RequestPart(value = "file", required = true) MultipartFile file) 两种方式的注解都行
-
后端接受POST请求:参数为JSON对象+文件时:这时候可以使用@RequestPart参数来接收实体对象,@RequestParam来单个接收参数
@RequestPart这个注解用在multipart/form-data表单提交请求的方法上。
@RequestParam也同样支持multipart/form-data请求。
@RequestParam和@RequestPart的区别是:@RequestParam适用于name-valueString类型的请求域,@RequestPart适用于复杂的请求域(像JSON,XML)
详细例子
传很多个参数
将传参header的content-type设置为:multipart/form-data ,将每个参数都当做文件进行传参(字段类型不同,文件为MultipartFile类型 ,文件数组为MultipartFile[]类型,其他为String类型) (前端很容易设置)
Postman测试接口工具
Java后端代码:注解全用@RequestParam ,全部用这一个注解接收参数(可行)
@PostMapping("/addDirectlySellGoods")
public Resource<String> addDirectlySellGoods(@RequestParam("goodsPicture") MultipartFile[] goodsFile, @RequestParam("certPicture") MultipartFile[] certFile,
@RequestParam("goodsName") String goodsName, @RequestParam("goodsType") String goodsType,
@RequestParam("goodsFee") String goodsFee, @RequestParam("sellerPosition") String sellerPosition,
@RequestParam("wechatAcct") String wechatAcct, @RequestParam("goodsDesc") String goodsDesc) {
InDirectlySellDto in = new InDirectlySellDto();
in.setGoodsName(goodsName);
in.setGoodsType(goodsType);
in.setGoodsFee(goodsFee);
in.setSellerPosition(sellerPosition);
in.setWechatAcct(wechatAcct);
in.setGoodsDesc(goodsDesc);
System.out.println("直接卖前端传递的参数:" + in);
String data = consignmentService.addDirectlySellGoods(goodsFile,certFile,in);
//String data = "COMMON_SUCCESS";
return new Resource<>(props.getProcessStatus(data));
}
自己项目中写的前端代码:
也是用于传输多个图片以及两个值 经纬度
<script>
function submitForm() {
var formData = new FormData();
var files = document.getElementById('files').files;
for (var i = 0; i < files.length; i++) {
formData.append('files', document.getElementById('files').files[i]);
}
formData.append('lng', document.getElementById('lng').value);
formData.append('lat', document.getElementById('lat').value);
fetch('/ComprehensiveScoring/getScore', {
method: 'POST',
body: formData,
})
.then(response => response.json())
.then(data => {
// 假设后端返回的是JSON格式的数据
document.getElementById('scoreValue').innerHTML = '<pre>' + JSON.stringify(data, null, 2) + '</pre>';
})
.catch(error => {
console.error('Error:', error);
document.getElementById('scoreValue').innerHTML = '<p>Error occurred.</p>';
});
// 由于是按钮点击事件,不需要阻止表单的默认提交行为
}
</script>
传一个文件参数+一个JSON对象
前端需将传参header的content-type , 通过判断设置为两种multipart/form-data + application/json(需百度自行查询,前端可能不容易设置)
Postman测试接口工具
ava后端代码:注解全用@RequestPart ,全部用这一个注解接收参数(可行)
@Validated 注解:用于验证 Java 对象中的属性是否符合验证规则(未仔细研究,不加一般也不会报错),可以提高代码的可读性和可维护性,同时也可以避免一些常见的错误,如空指针异常等
/**
* 数据上报接⼝
*/
@PostMapping("/dataReport")
public Resource<String> dataReport(@RequestPart(value = "file", required = true) MultipartFile file ,@RequestPart @Validated DataReportInDto dto){
String code = dataReportService.dataReport(file,dto);
return new Resource<>(props.getProcessStatus(code));
}
标签:传参,Java,String,RequestParam,JSON,RequestPart,参数,data
From: https://www.cnblogs.com/shuijibaobao/p/18317802