SpringBootMultipartFile上传⽂件时携带参数
在使⽤MultipartFile接收上传的⽂件时，⼀般会有接收其他请求参数的需求
当请求参数过多时，通常情况下会将请求参数封装为body上传，⽂件⽤单独的 MultipartFile 接收，但是这样写后端⼀直⽆法接收成功问题
@PostMapping("/save")
public Result<?> pushMoment(HttpServletRequest request,
@RequestBody ContentVo contentVo,
@RequestParam(value = "contentParam") MultipartFile contentParam
//...
}
HTTP请求分为了消息头和消息体，头信息⾥⾯的Content-Type字段定义了消息体的请求格式，接⼝⾥⾯声明 @RequestBody 的参数只能设置为 "Content-Type: application/json"，⽽ MultipartFile 参数只能设置
为"Content-Type: multipart/form-data"，上述两种格式并不是兼容的，那问题就来了，前端请求的时候 Content-Type 怎么设置，⽆论哪种格式都是错的。
body最终不能和MultipartFile同时存在
解决⽅案
前端统⼀格式"Content-Type: multipart/form-data"，结构体在前端传递的时候统⼀转成json字符串，后端接收以后⽤Gson转成结构体
@PostMapping("/save")
public Result<?> pushMoment(@RequestPart MultipartFile fileUrl,@RequestParam(value = "contentParam") String contentParam ) {
log.info("拿到的⽂件--->  ={}",OriginalFilename());
Gson gson = new Gson();
ContentUpload contentUpload = gson.fromJson(contentParam, ContentUpload.class);
}
<body>
<input id="file" type="file"/>
<br>
<button>post 请求</button>
<script>
const btns = document.querySelectorAll("button");
let contentUpload = {inputtypefile不上传文件
//....
};
let a = JSON.stringify(contentUpload)//将对象转为 JSON
console.log(a);
btns[0].onclick = () => {
const file = ElementById("file").files[0];
console.log(file)
let fileUrl = new FormData();
fileUrl.append("fileUrl", file, file.name);
axios({
//请求类型
method: 'POST',
//URL
url: 'localhost:9999/content/save',
headers: {
"Content-Type": "multipart/form-data;boundary=" + new Date().getTime()
},
data: fileUrl,//上传的⽂件
params: {
contentParam: a
}
}).then(res => {
console.log(res)
})
}
</script>
</body>