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. 前端要注意请求头信息
相关推荐
还听珊瑚海吗2 小时前
基于WebSocket和SpringBoot聊天项目ChatterBox测试报告
spring boot·websocket·网络协议
Monly212 小时前
RabbitMQ:SpringAMQP Topic Exchange(主题交换机)
spring boot·rabbitmq·java-rabbitmq
Pitayafruit8 小时前
Spring AI 进阶之路04:集成 SearXNG 实现联网搜索
spring boot·后端·ai编程
在努力的前端小白15 小时前
Spring Boot 敏感词过滤组件实现:基于DFA算法的高效敏感词检测与替换
java·数据库·spring boot·文本处理·敏感词过滤·dfa算法·组件开发
麦麦大数据1 天前
F003疫情传染病数据可视化vue+flask+mysql
mysql·flask·vue·大屏·传染病
白仑色1 天前
Spring Boot 全局异常处理
java·spring boot·后端·全局异常处理·统一返回格式
Monly211 天前
RabbitMQ:SpringAMQP 入门案例
spring boot·rabbitmq·java-rabbitmq
Monly211 天前
RabbitMQ:SpringAMQP Fanout Exchange(扇型交换机)
spring boot·rabbitmq·java-rabbitmq
每天学习一丢丢1 天前
Spring Boot + Vue 项目用宝塔面板部署指南
vue.js·spring boot·后端