Java @RequestPart注解:同时实现文件上传与JSON对象传参

@RequestPart注解：用于处理multipart/form-data请求的一部分，通常用于文件上传或者处理表单中的字段。

java后端举例：

    @PostMapping("/fileTest")public AjaxResult fileTest(@RequestPart("file") MultipartFile file,@RequestPart("dept") Dept dept){String originalFilename = file.getOriginalFilename();System.out.println(originalFilename);System.out.println(dept);return success();}

 Postman测试接口传参格式：

 注意事项： dept类型的格式是application/json

前端使用的是vue3

async function uploadDept(){const  formData = new FormData();
//文件类型formData.append('file',queryParamsFile.value.file);
//获取值方式一：let dept = JSON.stringify({...form.value})
//获取值方式二：用于测试const  deptInfo = JSON.stringify({"deptId": 33,"deptName": "财务部","leader": null,"phone": null,"email": null,});
//添加blob类型formData.append('dept', new Blob([dept], { type: "application/json" }));
// formData.append('dept', new Blob([deptInfo],{type : "application/json"});//调用接口await uploadFileTest(formData).then(response => {proxy.$modal.msgSuccess("成功");});}

调用后端接口配置

export const uploadFileTest = (data)=>{return axios({headers: {'Content-Type': 'multipart/form-data'},url:'/dept/fileTest',method:'post',//忽略contentTypedata: data,//取消序列化contentType: false,// dataType: 'json',//设置请求头processData: false})
}

 注意：有可能有问题的地方

在axios 的配置文件中，注意下面这个，把config.headers['Content-Type'] 这行注释掉

request.interceptors.request.use(config => {
if(config && config.headers){
//如果有这一行，注释下再试试
// config.headers['Content-Type'] = 'application/json;charset=utf-8';  
}