SpringBoot 如何同时接收文件以及json参数

SpringBoot 如何同时接收文件以及json参数

前端传参

js 复制代码
let upData = new FormData();
// 将文件列表赋值给files参数
this.files.forEach(function (file) {
  upData.append("files", file);
});
this.firmwareSaveDto = this.formData;
let commodityDto = JSON.stringify(this.firmwareSaveDto);
// 将json对象赋值给saveDto参数
upData.append(
  "saveDto",
  new Blob([commodityDto], { type: "application/json" })
);
// 发送请求,注意请求头信息
axios.post('/v1/test/upload_files', upData, {
    headers: {
        'Content-Type': 'multipart/form-data'
    }
})

后端接收

java 复制代码
/**
 * 上传文件
 * @param files
 * @param saveDto
 * @return
 */
@PostMapping(value = "/upload_files",name = "上传文件")
public ExecuteResult uploadFiles(
						@RequestPart("files") MultipartFile[] files,
                        @RequestPart("saveDto") @Valid SaveDtosaveDto){
	// 逻辑代码。。。。。。
}

注意

  1. 后端【同时接收文件以及json参数】时使用@RequestPart注解。
  2. 后端与前段要约定好文件与json的对应参数名files、saveDto
  3. 前端要注意请求头信息
相关推荐
yyt3630458414 小时前
KlineChartQuant Tooltip 高频交互 200FPS 性能优化完整复盘
前端·经验分享·性能优化·typescript·vue·交互·chrome devtools
Fuzio5 小时前
用 Spring Boot + Vue + Fuzio 构建现代 Java 桌面应用
vue.js·spring boot
乐观的Terry5 小时前
1、为什么要自己造发布系统
java·spring boot·后端·spring cloud·架构
web行路人7 小时前
Spring Boot 第四周:集成 Spring Security 与 JWT 鉴权实践
spring boot·后端·spring
QQ_21696290968 小时前
【项目编号:project05966】SpringBoot/Vue 电影推荐系统:用户端推荐、电影资讯与后台数据管理全流程
vue.js·spring boot·后端
吴声子夜歌8 小时前
Redis 6.x——整合SpringBoot
数据库·spring boot·redis
程序员黎剑10 小时前
我把算卦变成了一段if-else
java·vue.js·spring boot·后端·ai编程
3DVisionary10 小时前
如何用单目高速DIC把“看不见“的振动变成“数得清“的数据
java·spring boot·python·数码相机·微小振动·精密件·单目高速dic
hdsoft_huge10 小时前
SpringBoot系列12:整合RabbitMQ消息队列,异步解耦、死信队列完整业务案例
spring boot·rabbitmq·java-rabbitmq
豆瓣鸡1 天前
RocketMQ学习-Spring Boot消息实践
java·spring boot·rocketmq