JAVA使用upload上传文件并带参数传给后端charset=UTF-8 not supported异常

最新推荐文章于 2023-08-30 20:16:04 发布

原创最新推荐文章于 2023-08-30 20:16:04 发布 · 977 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#java #javascript

前后端交互专栏收录该内容

1 篇文章

订阅专栏

本文介绍在Vue和Element UI框架下，结合Java后端实现文件上传功能的方法。特别关注如何正确设置请求参数，避免使用@RequestBody接收MultipartFile类型数据导致的错误，并给出正确的后端控制器代码示例。

Vue、Element、JAVA下使用upload上传文件并带参数传给后端

  <el-upload 
           	 class="upload-demo"
             :action="uploadUrl+'/fly/uavAsset/upload'"
             :data="groupId"
             :show-file-list="false"
             :headers="headers"
             :on-success="onSuccess"
             :before-upload="beforeAvatarUpload">

	带入参数groupID，请求参数的格式如下为

在这里插入图片描述
此时后端如果使用@RequestBody接收会报出
org.springframework.web.HttpMediaTypeNotSupportedException: Content type ‘multipart/form-data;boundary=----WebKitFormBoundarywY7ByvgonAjDoaCT;charset=UTF-8’ not supported

@RequestBody表示将JSON或XML数据与DTO bean映射一起使用。如果是MultipartFile，则不能使用JSON数据，因此不能使用@RequestBody。应该使用@ModelAttribute如下

public ExcelResult uploadExcel(@ModelAttribute UploadDto uploadDto) {}

@Data
public class UploadDto {

    private MultipartFile file;

    private Integer groupId;
}

这样就后端就能够接收到MultipartFile 和 json 参数啦