我想将表单内的文件上传到Spring Boot API端点。
UI用React编写:
export function createExpense(formData) {
return dispatch => {
axios.post(ENDPOINT,
formData,
headers: {
'Authorization': //...,
'Content-Type': 'application/json'
}
).then(({data}) => {
//...
})
.catch(({response}) => {
//...
});
};
}
_onSubmit = values => {
let formData = new FormData();
formData.append('title', values.title);
formData.append('description', values.description);
formData.append('amount', values.amount);
formData.append('image', values.image[0]);
this.props.createExpense(formData);
}
这是java边码:
@RequestMapping(path = "/{groupId}", method = RequestMethod.POST)
public ExpenseSnippetGetDto create(@RequestBody ExpensePostDto expenseDto, @PathVariable long groupId, Principal principal, BindingResult result) throws IOException {
//..
}
但是我在Java方面遇到了这个异常:
org.springframework.web.HttpMediaTypeNotSupportedException: Content type 'multipart/form-data;boundary=----WebKitFormBoundaryapHVvBsdZYc6j4Af;charset=UTF-8' not supported
我应该如何解决这个问题?类似的API端点和JavaScript辅助代码已在工作。
我已经看到了一个解决方案,其中建议请求主体应具有2个属性:一个位于JSON部分之下,另一个用于图像。我想看看是否有可能将其自动转换为DTO。
客户端发送的上载负载应转换为以下DTO:
public class ExpensePostDto extends ExpenseBaseDto {
private MultipartFile image;
private String description;
private List<Long> sharers;
}
因此,您可以说这是JSON和 multipart 的混合。
该问题的解决方案是FormData
在前端和ModelAttribute
后端上使用:
@RequestMapping(path = "/{groupId}", method = RequestMethod.POST,
consumes = {"multipart/form-data"})
public ExpenseSnippetGetDto create(@ModelAttribute ExpensePostDto expenseDto, @PathVariable long groupId, Principal principal) throws IOException {
//...
}
并在前端摆脱掉,Content-Type
因为它应该由浏览器本身确定并使用FormData
(标准JavaScript)。那应该解决问题。
是的,您可以简单地通过包装类来实现。
1)创建一个Class
保存表单数据:
public class FormWrapper {
private MultipartFile image;
private String title;
private String description;
}
2)创建form
用于提交数据的HTML :
<form method="POST" enctype="multipart/form-data" id="fileUploadForm" action="link">
<input type="text" name="title"/><br/>
<input type="text" name="description"/><br/><br/>
<input type="file" name="image"/><br/><br/>
<input type="submit" value="Submit" id="btnSubmit"/>
</form>
3)创建一种接收表单text
数据和multipart
文件的方法:
@PostMapping("/api/upload/multi/model")
public ResponseEntity<?> multiUploadFileModel(@ModelAttribute FormWrapper model) {
try {
// Save as you want as per requiremens
saveUploadedFile(model.getImage());
formRepo.save(mode.getTitle(), model.getDescription());
} catch (IOException e) {
return new ResponseEntity<>(HttpStatus.BAD_REQUEST);
}
return new ResponseEntity("Successfully uploaded!", HttpStatus.OK);
}
4)保存方法file
:
private void saveUploadedFile(MultipartFile file) throws IOException {
if (!file.isEmpty()) {
byte[] bytes = file.getBytes();
Path path = Paths.get(UPLOADED_FOLDER + file.getOriginalFilename());
Files.write(path, bytes);
}
}
问题内容: 我想将表单内的文件上传到Spring Boot API端点。 UI用React编写: 这是java边码: 但是我在Java方面遇到了这个异常: 我应该如何解决这个问题?类似的API端点和JavaScript辅助代码已在工作。 注意 我已经看到了一个解决方案,其中建议请求主体应具有2个属性:一个位于JSON部分之下,另一个用于图像。我想看看是否有可能将其自动转换为DTO。 更新1 客户端
我是springboot的新手,非常需要你的专业知识。请帮帮我。 我需要在点击按钮时将数据传递给控制器。现在我面临着下面的错误,我的代码到底做错了什么? 控制器 HTML 模型
我正在尝试上传一个文本文件(也尝试了PDF等)到Salesforce。文本文件包含“Hello World”。 这是我正在使用的代码 这将导致以下看起来符合Salesforce指导原则的请求正文:https://developer.Salesforce.com/docs/atlas.en-us.api_rest.meta/api_rest/dome_sobject_insert_update_bl
问题内容: 我正在尝试将JSON数组发布到MVC控制器。但是,无论我尝试什么,都为0或null。 我有包含文本框的表。我需要所有这些文本框中的ID和值作为对象。 这是我的Javascript: 这是我的查看代码: 这是控制器即时通讯试图接收数据以: 我究竟做错了什么? 问题答案: 您的代码有很多问题。让我们从标记开始。您有一个表,该表的每一行中都包含隐藏字段。除了您已经对那些隐藏元素的属性进行了硬
我正试图从这个js发布我的数据 有什么建议如何修复它吗? 堆栈跟踪:
我有使用Springboot和Thymeleaf模板编写的简单Web应用程序。报告控制器从表单接收数据并构建TestPlanReportReportACK对象,该对象作为模型属性添加如下: 我可以在“图表”thymeleaf模板中使用该数据并显示我需要的数据,但我需要在单击按钮时将完全相同的对象发送回控制器,但我得到TestPlanReportACK对象作为设置空值的参数。 以下是我的按钮在图表模